WEBVTT 00:01.560 --> 00:06.240 Now let's try and see first if jQuery is enabled on this page. 00:06.240 --> 00:13.080 So we go inside of the console, inside of the Chrome developer tools and we can see something comes 00:13.080 --> 00:17.550 up when I press the dollar sign, which means that jQuery is on the page. 00:18.730 --> 00:24.550 Remember that every shop had this result info class inside of this p element. 00:24.640 --> 00:32.350 Well, we can see when we write result info the selector for result info we get 120 elements, which 00:32.350 --> 00:35.410 means we get all of the jobs on the page. 00:35.410 --> 00:36.640 So that's great. 00:36.880 --> 00:38.620 Now let's try, try. 00:38.650 --> 00:42.510 Let's just try and go inside of the result info element. 00:42.520 --> 00:42.970 We see. 00:42.970 --> 00:46.900 We have a H element which has the link. 00:47.650 --> 00:51.130 And the title of the job. 00:51.490 --> 01:01.780 So maybe if we try and get the the header link class or the result title class, we can get all of the 01:01.780 --> 01:03.010 job titles. 01:05.280 --> 01:06.480 Let's try and do that. 01:07.420 --> 01:12.220 So we go through each of the result info elements. 01:12.760 --> 01:20.590 We make a each loop here, which has a index and an element, and the element is then each of the job 01:20.590 --> 01:21.400 titles. 01:21.940 --> 01:32.710 So if we write console.log dollar sign and have my element in here and then I can do a selector like 01:32.740 --> 01:41.050 find or children, I'm going to use children now and I will select all the children which has the class 01:41.050 --> 01:42.520 of result title. 01:42.970 --> 01:46.270 And that's going to get me the title of every job. 01:53.430 --> 01:57.160 You here we have the result info class for every job. 01:57.160 --> 02:05.020 And then inside there's a h element which has the class of result title and we can use that to get the 02:05.200 --> 02:06.580 job title. 02:07.930 --> 02:13.480 And now I just need to figure out what where I'm missing my parent pieces here. 02:13.480 --> 02:15.340 So hold on a moment. 02:17.320 --> 02:21.640 I just need to figure out where it's missing. 02:23.300 --> 02:28.910 There's a lot of parenthesis, so hang in there, but we'll figure it out. 02:32.300 --> 02:32.690 Okay. 02:32.690 --> 02:32.930 Yeah. 02:32.930 --> 02:34.550 I missed one at the end here. 02:34.550 --> 02:37.520 And we get all of the job titles now. 02:38.540 --> 02:39.470 So. 02:41.410 --> 02:47.860 And now we can basically just paste this code that we made inside of the Chrome console inside of our 02:47.860 --> 02:49.480 NodeJS project. 02:50.380 --> 02:52.250 Let me show you how that works. 02:52.270 --> 02:54.250 We just select all of this. 03:00.170 --> 03:04.310 And then I can paste it inside of my NodeJS project. 03:06.780 --> 03:07.500 Like so. 03:08.980 --> 03:17.050 And you can notice we're using the dollar sign that we defined using Jerry load, which then gives us 03:17.050 --> 03:24.250 the opportunity to just copy paste code from the Chrome console, which is also using the dollar sign 03:24.250 --> 03:27.490 to select elements using jQuery. 03:28.270 --> 03:33.610 And you will see we get exactly the same output as we did inside of Chrome console. 03:34.180 --> 03:39.310 So we write run the Index.js file using node index.js. 03:40.230 --> 03:44.520 And we should see the exact same output as inside Chrome console. 03:45.840 --> 03:46.590 There you go. 03:50.600 --> 03:55.730 Okay, last thing I'm going to do, I think I will just make a variable called title. 03:55.730 --> 04:01.910 So we'll say const title instead of having a console log like that. 04:03.580 --> 04:09.520 So now let's try and get the URL for the job where we can read the description. 04:09.520 --> 04:18.940 You can see that inside of the H element, which has the href attribute as you call it, which has the 04:18.940 --> 04:20.260 URL for the job. 04:20.710 --> 04:29.680 So let's make a variable for just the title and then we can select the title and the URL. 04:29.710 --> 04:31.060 Let me show you what I mean. 04:31.240 --> 04:37.000 So let's call it result title and put in the element itself in here. 04:38.350 --> 04:45.190 Then from the result title, I can just say dot text to get the title of the job and to get the URL 04:45.220 --> 04:45.850 of the job. 04:45.850 --> 04:53.920 I'd say attribute href and this is exactly the same as if I was using jQuery, of course. 04:54.740 --> 04:59.470 Um, so if you're familiar with jQuery, this should be really familiar to you. 05:00.410 --> 05:03.940 Then I think I want to put this inside of our object. 05:03.950 --> 05:07.070 They say, like the sample object we defined before. 05:07.880 --> 05:09.440 I would just call it scrape, assault. 05:09.440 --> 05:11.720 And this up here, I call scrape, sample. 05:13.890 --> 05:17.520 And and here we put in the title and the URL. 05:25.570 --> 05:32.350 And now we'll define an array where I put in all of my different scrape results, which is the different 05:32.350 --> 05:37.510 jobs, and I will just push the result onto here. 05:41.710 --> 05:47.530 And then in the end, we can also try and do a console log of our array with all the jobs to see how 05:47.530 --> 05:48.460 it looks like. 05:59.020 --> 06:00.280 Hey, let's try and run it. 06:00.310 --> 06:02.230 Node Index.js. 06:02.830 --> 06:10.960 And we can see there's a pretty array coming up with lots of objects, which has a title and a URL for 06:10.960 --> 06:11.710 the job. 06:12.880 --> 06:17.410 So now we just need to add more properties to these scraped results.