1
00:00:00,350 --> 00:00:03,240
This video I have a fun and quick challenge for you.

2
00:00:03,300 --> 00:00:09,540
So on this event reference page there are a ton of events as we saw in the last video and I want to

3
00:00:09,540 --> 00:00:11,550
know exactly how many are here.

4
00:00:11,790 --> 00:00:17,610
And I definitely don't want you to count manually so write javascript code to figure out how many of

5
00:00:17,610 --> 00:00:20,550
these events exist on this page.

6
00:00:20,730 --> 00:00:24,660
So I recommend that you just open up the console and start typing some stuff in here.

7
00:00:24,990 --> 00:00:29,990
And the hint that you'll get is that each event is one of these elements.

8
00:00:29,990 --> 00:00:35,520
Whatever these are I don't know what these are but whatever each one of these is corresponds to a separate

9
00:00:35,520 --> 00:00:36,560
event on this page.

10
00:00:36,660 --> 00:00:38,720
So count how many of these there are.

11
00:00:39,030 --> 00:00:41,940
So this problem is a great use for the javascript con..

12
00:00:42,000 --> 00:00:47,430
It covers a lot of the stuff that we've been talking about selecting and looping through things.

13
00:00:47,430 --> 00:00:50,850
So go ahead and give this a shot on your own positive video if you need to.

14
00:00:50,850 --> 00:00:52,120
And then I'll go for solution.

15
00:00:52,140 --> 00:00:54,710
And just a moment.

16
00:00:56,520 --> 00:00:58,930
OK so let's talk about how we could find this out.

17
00:00:58,980 --> 00:01:01,320
How many events are on this page.

18
00:01:01,320 --> 00:01:04,060
My first instinct would be to inspect.

19
00:01:04,260 --> 00:01:05,830
So let's take a look.

20
00:01:05,850 --> 00:01:06,860
These are Tweedy's.

21
00:01:06,860 --> 00:01:07,790
It looks like.

22
00:01:08,210 --> 00:01:09,880
So we have one T.T. there.

23
00:01:10,130 --> 00:01:10,420
OK.

24
00:01:10,430 --> 00:01:12,750
So each event is its own.

25
00:01:12,750 --> 00:01:15,360
TR So you can see.

26
00:01:15,840 --> 00:01:17,350
So that's one event.

27
00:01:17,430 --> 00:01:24,270
This is the next event which is inside of a TR so we can do is just count the number of tiers on this

28
00:01:24,270 --> 00:01:25,080
page.

29
00:01:25,080 --> 00:01:28,680
The problem is there might be some other tables that we don't know about.

30
00:01:28,680 --> 00:01:34,410
So let's see let's do a query selector all.

31
00:01:34,410 --> 00:01:36,300
TR Well let's even just do table.

32
00:01:36,360 --> 00:01:38,920
Let's see how many tables are on the page.

33
00:01:39,000 --> 00:01:41,970
Forgot document.

34
00:01:41,970 --> 00:01:43,160
We have one table here.

35
00:01:43,200 --> 00:01:48,290
OK that looks good we have another table down below where is this one.

36
00:01:49,350 --> 00:01:51,330
Let's see.

37
00:01:52,900 --> 00:01:53,270
OK.

38
00:01:53,280 --> 00:01:54,450
Non-standard events.

39
00:01:54,450 --> 00:01:55,490
OK that's right.

40
00:01:55,530 --> 00:01:57,500
We also want to count those.

41
00:01:58,440 --> 00:02:03,220
And then we also want to count this table which we also got correct.

42
00:02:03,270 --> 00:02:06,930
And this one and then is a table at the bottom.

43
00:02:06,960 --> 00:02:08,830
So these are all the events that we want.

44
00:02:09,120 --> 00:02:14,200
So now that we figured out that the only tables on the page are the ones that we care about.

45
00:02:14,220 --> 00:02:18,430
I was worried they could be using a table over here on the nav bar or somewhere up here.

46
00:02:18,480 --> 00:02:24,180
But it turns out the only tables on the page and therefore the only team is on the page are relevant

47
00:02:24,180 --> 00:02:25,020
to this problem.

48
00:02:25,050 --> 00:02:32,640
They contain these events so we want to do now is select documents or queries like you're all TR And

49
00:02:32,640 --> 00:02:36,410
that would give us all the yours says 306.

50
00:02:36,750 --> 00:02:42,530
So let's open up the first one and we can see these correspond to the individual events.

51
00:02:42,540 --> 00:02:48,660
There is one small problem which is the very first TR is actually the headers here.

52
00:02:48,990 --> 00:02:57,720
So we would have to exclude one from this table and then we have this table down here that also has

53
00:02:57,780 --> 00:02:59,700
headers so we need to exclude that one.

54
00:02:59,850 --> 00:03:06,330
So for every table there's one two three four five really need to subtract five rows because we don't

55
00:03:06,330 --> 00:03:07,940
want these here.

56
00:03:08,310 --> 00:03:14,220
So to figure out how many events are on this page we just need to get the length of all the tiaras So

57
00:03:14,220 --> 00:03:16,170
that list that is returned.

58
00:03:16,500 --> 00:03:18,980
This one here I need to figure out how long that is.

59
00:03:18,990 --> 00:03:22,160
So document queries like your all TR length.

60
00:03:22,430 --> 00:03:26,290
And that gives us $360 on this page.

61
00:03:26,310 --> 00:03:32,270
The only thing we have to exclude those five headers so we could do it like this minus 5.

62
00:03:32,760 --> 00:03:34,600
And that gives us 301.

63
00:03:34,890 --> 00:03:40,160
However that is a little bit hard coded because we're assuming there's always five tables.

64
00:03:40,380 --> 00:03:46,200
What if they added a sixth table of events this would be accounting for all the TR is on the page but

65
00:03:46,200 --> 00:03:47,810
we would still be subtracting 5.

66
00:03:48,000 --> 00:03:53,040
So what we actually want to subtract is the length of how many tables are on the page.

67
00:03:53,160 --> 00:03:57,210
So for every table there is one TR that has the headings on it.

68
00:03:57,540 --> 00:04:02,520
So it will look like this document that queries Lechter all TR hotlink minus.

69
00:04:02,520 --> 00:04:04,550
Document that query selector.

70
00:04:04,920 --> 00:04:10,440
All tables are table hotlink.

71
00:04:11,100 --> 00:04:14,050
And that also gives us three hundred and one.

72
00:04:14,070 --> 00:04:19,890
So this exercise serves two purposes one just to get more practice using the console selecting things

73
00:04:19,900 --> 00:04:20,090
.

74
00:04:20,340 --> 00:04:25,560
And the second one is to show you that there are a ton of events out there way way more than you'll

75
00:04:25,560 --> 00:04:26,440
ever need to use.

76
00:04:26,460 --> 00:04:27,380
But it's good to be aware.

77
00:04:27,380 --> 00:04:32,760
There's apparently 301 but like I said a few years ago it's a pretty small world.

78
00:04:32,760 --> 00:04:36,860
Most of the time you'll use about 10 maybe 15.

79
00:04:37,050 --> 00:04:38,550
But there are apparently 301