WEBVTT 00:00:07.140 --> 00:00:14.380 It is video you're going to learn how to change a shemale content and attributes using Jay Querrey. 00:00:14.400 --> 00:00:19.980 First we're going to be using the same source code showing our three diverse Facebook Apple and Microsoft 00:00:19.990 --> 00:00:20.370 . 00:00:20.730 --> 00:00:21.580 All right. 00:00:22.110 --> 00:00:29.730 And the objective of the session is to create a few buttons and when we click on those buttons we'd 00:00:29.730 --> 00:00:33.740 like the content of these things to change. 00:00:33.750 --> 00:00:34.800 All right. 00:00:34.800 --> 00:00:39.680 So let's start with Facebook and create a button that will change the content of Facebook. 00:00:40.320 --> 00:00:48.410 So we're going to create a buzz and just after the Microsoft stuff. 00:00:48.480 --> 00:00:49.960 All right. 00:00:50.430 --> 00:00:52.040 Let's write some checks there. 00:00:52.110 --> 00:00:55.820 So change Facebook. 00:00:56.040 --> 00:00:57.260 I don't want to change the text here. 00:00:57.270 --> 00:01:06.880 So you say change Facebook text and let's give us an idea change Facebook. 00:01:06.890 --> 00:01:08.060 All right. 00:01:08.280 --> 00:01:14.910 So let's go inside our documents ready function to write Arjay query code. 00:01:15.150 --> 00:01:21.480 So first of all we need to access the button and say in the event of clicking on the button we're going 00:01:21.480 --> 00:01:24.650 to access Facebook and change the content of Facebook. 00:01:24.830 --> 00:01:25.300 OK. 00:01:25.500 --> 00:01:32.720 So to say it sucks is we needs a selector for the button using its ID. 00:01:33.270 --> 00:01:35.040 So it's change Facebook 00:01:38.320 --> 00:01:50.570 then the event here is click and we're going to need to put everything between parentheses and he's 00:01:50.580 --> 00:01:58.380 going to be a definition of a function and the code of the mission is going to be between curly brackets 00:01:58.390 --> 00:01:59.090 . 00:01:59.940 --> 00:02:02.630 So we need to access the Facebook Dave. 00:02:03.240 --> 00:02:09.740 So you use the selector of the ID or Facebook which is Facebook. 00:02:10.740 --> 00:02:12.360 And then 00:02:17.100 --> 00:02:18.970 we can use a method here. 00:02:19.050 --> 00:02:23.080 It's text and. 00:02:23.340 --> 00:02:28.030 It needs one parameter which is going to be a string. 00:02:28.710 --> 00:02:36.420 So how this method works is going to take this promiser and whatever we put between the quotes is going 00:02:36.420 --> 00:02:40.530 to replace the content of Facebook. 00:02:40.530 --> 00:02:47.160 So basically the content of Facebook is everything between the tags which is what we just highlighted 00:02:47.160 --> 00:02:48.220 . 00:02:48.240 --> 00:02:49.920 All right. 00:02:49.920 --> 00:02:51.420 So let's try for answers. 00:02:51.600 --> 00:02:57.240 This is Facebook and let's see what happens. 00:02:57.570 --> 00:03:01.400 So you can see that once we click on the button the content has just changed. 00:03:01.500 --> 00:03:07.050 And this this is showing exactly the same HMO code here. 00:03:07.050 --> 00:03:12.240 The only thing that changed is that rather than having the paragraph and response as we just have some 00:03:12.250 --> 00:03:17.750 text which is between whatever is between the codes. 00:03:17.760 --> 00:03:18.550 All right. 00:03:19.080 --> 00:03:20.200 OK. 00:03:20.880 --> 00:03:25.790 Now we're going to try something else when we're going to create another button and we want that message 00:03:25.830 --> 00:03:32.630 to change the contents of up at this time we will change the content using some HLL code. 00:03:32.640 --> 00:03:33.470 All right. 00:03:33.750 --> 00:03:37.710 So we're just going to copy paste the same code. 00:03:38.110 --> 00:03:39.570 So this time. 00:03:39.570 --> 00:03:43.550 So we need access another button that will change up. 00:03:43.590 --> 00:03:55.770 So this creates that person going to call it Change Apple and they say here change Upal HMO because 00:03:55.770 --> 00:04:00.990 we're going to be using some HMO code to replace the contents. 00:04:00.990 --> 00:04:02.540 OK so change. 00:04:02.550 --> 00:04:03.900 So we are accessing change. 00:04:03.990 --> 00:04:13.500 Apple button and the statements is going to be accessing the up all day. 00:04:14.130 --> 00:04:20.820 And rather than using the text method this time we're going to use another method it's called a shemale 00:04:20.820 --> 00:04:22.000 . 00:04:22.020 --> 00:04:28.410 So what this method is doing is going to be taking a barometer and inside the promissary going to be 00:04:28.410 --> 00:04:30.840 writing some Esquibel code. 00:04:31.050 --> 00:04:39.330 So that's Ishmail code is going to replace whatever Ishmail code is between the div tags off the apple 00:04:39.330 --> 00:04:40.160 day. 00:04:40.790 --> 00:04:41.510 OK. 00:04:41.790 --> 00:04:43.790 So let's try something like this. 00:04:43.800 --> 00:04:47.430 So for example is Troy. 00:04:47.970 --> 00:04:50.930 This is Apple. 00:04:51.670 --> 00:04:52.790 There's one paragraph. 00:04:53.070 --> 00:04:54.580 Let's add another paragraph. 00:04:57.360 --> 00:05:09.510 For example knew I was available and it's close partner and I were expecting this a shemale to replace 00:05:09.500 --> 00:05:12.370 the contents of the apple. 00:05:12.540 --> 00:05:14.660 Dave which is which is this. 00:05:14.810 --> 00:05:22.110 OK it's safe to refresh the page and only click on the button and we can see that the contents of the 00:05:22.290 --> 00:05:23.100 apple. 00:05:23.110 --> 00:05:27.350 Dave has it changed to our couple of paragraphs. 00:05:27.620 --> 00:05:28.860 All right. 00:05:29.480 --> 00:05:30.120 OK. 00:05:30.380 --> 00:05:33.730 Now we're going to try something else we can create any books. 00:05:33.940 --> 00:05:34.680 OK. 00:05:34.920 --> 00:05:38.980 Just there and we are going to create another button. 00:05:39.000 --> 00:05:42.060 This will change the value of the inputs. 00:05:42.690 --> 00:05:47.650 So let's create the inputs just before the buttons. 00:05:48.120 --> 00:05:50.500 Let's put it inside a paragraph. 00:05:52.320 --> 00:05:54.050 OK. 00:05:54.890 --> 00:05:58.040 OK we need to add another statements here. 00:05:58.140 --> 00:06:02.920 We're just going to copy paste the same statements. 00:06:02.940 --> 00:06:06.470 So it is time we can access another person. 00:06:06.540 --> 00:06:08.670 So let's create another person. 00:06:10.410 --> 00:06:20.070 Let's have an ID for the person change inputs change put value on it. 00:06:20.340 --> 00:06:25.120 So change inputs. 00:06:25.640 --> 00:06:30.560 We have only one input there so we can just use the input type. 00:06:30.750 --> 00:06:34.170 And now we are going to use another method. 00:06:34.410 --> 00:06:36.690 It's called Vau. 00:06:37.290 --> 00:06:40.470 So what this method is going to be doing it's going to be taking a barometer. 00:06:40.470 --> 00:06:41.980 So again it's a string. 00:06:42.380 --> 00:06:49.010 So it's going to be taking the value of the string and it's going to be replacing the value of the input 00:06:49.860 --> 00:06:51.290 by the string. 00:06:51.380 --> 00:07:07.530 So if we use for example some it's some text just before the inputs for example enter your name OK the 00:07:07.520 --> 00:07:09.070 noblest refresh the page. 00:07:09.210 --> 00:07:14.310 And if you click on the button so we can see that the value of the input has just changed to the string 00:07:14.340 --> 00:07:16.170 we have used that. 00:07:16.310 --> 00:07:17.310 All right. 00:07:17.970 --> 00:07:19.150 OK. 00:07:19.760 --> 00:07:24.680 Now we're going to see how to change the attributes of links. 00:07:25.050 --> 00:07:29.320 So we're going to be creating a link inside the Microsoft state. 00:07:29.490 --> 00:07:36.180 We're going to write some code so that we can click on a button and change the ATF of the link. 00:07:36.180 --> 00:07:37.080 All right. 00:07:37.480 --> 00:07:40.460 And also we continue to title the link as well. 00:07:40.620 --> 00:07:42.210 So let's go for that. 00:07:42.210 --> 00:07:48.080 So first of all this creates a paragraph inside the Microsoft stuff. 00:07:48.360 --> 00:07:53.730 It's going to be another paragraph there and inside the paragraph let's have a link. 00:07:54.060 --> 00:07:58.050 So let's have an ref for the link. 00:07:58.350 --> 00:08:02.550 So HGP called on fossilise fossilized. 00:08:03.530 --> 00:08:11.250 Let's go for Microsoft's source code and also it's have a title. 00:08:11.250 --> 00:08:15.840 Microsoft also is giving us an ID. 00:08:16.580 --> 00:08:24.200 Let's go for Microsoft's link. 00:08:27.250 --> 00:08:28.440 OK. 00:08:29.080 --> 00:08:30.410 Microsoft. 00:08:30.880 --> 00:08:33.560 OK. 00:08:33.740 --> 00:08:38.290 These are some text. 00:08:41.390 --> 00:08:42.300 Ok so now 00:08:46.200 --> 00:08:48.070 let's write some code. 00:08:48.680 --> 00:08:55.530 So we're going to be accessing the the button that will change the Microsoft link. 00:08:55.520 --> 00:08:56.970 So first let's create that person 00:09:00.030 --> 00:09:03.650 and call it Change Microsoft. 00:09:04.620 --> 00:09:09.660 OK change Microsoft. 00:09:11.250 --> 00:09:11.840 OK. 00:09:12.120 --> 00:09:25.430 So we're accessing the button boy it's ID so change Microsoft and the event is click on right. 00:09:26.120 --> 00:09:35.070 Everything goes between Prentice's And as we're where we define our function is Colusa carry brocades 00:09:35.750 --> 00:09:40.700 and now we need the statements where we access the Microsoft link. 00:09:40.760 --> 00:09:45.210 So we need to Selecta using the ID of the link. 00:09:45.240 --> 00:09:47.240 So Microsoft link. 00:09:47.920 --> 00:09:48.770 OK. 00:09:49.130 --> 00:09:56.340 And then we can use another method here to change the US abuse of the link. 00:09:56.370 --> 00:09:59.190 It's the attribute method. 00:09:59.690 --> 00:10:03.010 OK so let's pay attention to the syntax. 00:10:03.170 --> 00:10:04.700 It's a double t r. 00:10:04.880 --> 00:10:05.580 All right. 00:10:05.830 --> 00:10:15.150 And then the method is going to be taken as a barometer. 00:10:15.140 --> 00:10:17.930 Something between curly brackets. 00:10:18.400 --> 00:10:19.390 OK. 00:10:19.470 --> 00:10:24.430 And we can put as many promises as we want. 00:10:24.750 --> 00:10:25.070 OK. 00:10:25.110 --> 00:10:28.300 So we can go one two on one. 00:10:28.560 --> 00:10:37.610 So the syntax is going to be a barometer between quotes followed by going on and then between quotes 00:10:37.640 --> 00:10:41.210 we get to put the value of the promise. 00:10:41.820 --> 00:10:44.670 So let's change the ref first. 00:10:45.300 --> 00:10:52.250 So we want to change or something else so we're going to go for HGP for voice life was like let's go 00:10:52.250 --> 00:10:54.730 for the Google home page. 00:10:55.100 --> 00:10:56.780 OK. 00:10:56.800 --> 00:11:03.030 And then to add another barometer we use a comma. 00:11:03.060 --> 00:11:06.480 This time we want to go for the title. 00:11:06.950 --> 00:11:12.640 OK let's say the title to Google. 00:11:12.650 --> 00:11:13.630 So we're cheating here. 00:11:13.700 --> 00:11:16.770 Both the ref and the title. 00:11:16.760 --> 00:11:19.660 So let's try this. 00:11:19.650 --> 00:11:24.240 So now if we Hoeber on the Microsoft link we can see that the title is Microsoft's. 00:11:24.380 --> 00:11:27.340 And if you click there is going to take us to the Microsoft web page. 00:11:27.360 --> 00:11:32.740 Now if you click on the link and we check the title is Google Now. 00:11:32.790 --> 00:11:36.200 And also if you click there it's going to take you to the Google homepage. 00:11:36.200 --> 00:11:40.900 All right.