1
00:00:00,570 --> 00:00:01,430
Welkom terug.

2
00:00:01,590 --> 00:00:11,220
In deze video gaan we verder waar we gebleven waren en blijven praten over een aantal van deze belangrijke methoden die ik wil presenteren de volgende gaan we bespreken is na acht.

3
00:00:11,370 --> 00:00:16,290
En het is kort voor attribuut, dus ik ga om te gaan naar de documenten en gewoon op zoek naar attributen.

4
00:00:16,530 --> 00:00:19,550
Het gaat om up top hier ETR.

5
00:00:19,680 --> 00:00:20,500
Daar gaan we.

6
00:00:20,730 --> 00:00:24,930
En wat we gebruiken voor is om de waarde van een attribuut te halen.

7
00:00:25,230 --> 00:00:34,680
Dus volgens de documentatie het wordt de waarde van een kenmerk voor het eerste element in een stel van passende elementen of set een of meer kenmerken voor elk element gekoppeld.

8
00:00:34,680 --> 00:00:39,170
Dus we kunnen een attribuut op te halen of kunnen we een attribuut in te stellen.

9
00:00:39,210 --> 00:00:51,320
Hopelijk je merken een patroon door nu waar met deze methodes kunnen we ofwel informatie op te halen een attribuut of haal styling of de tekst te halen of woedend hem uit.

10
00:00:51,540 --> 00:00:55,610
En dan kunnen we ze ook instellen door het passeren van het een argument voor de methode.

11
00:00:55,620 --> 00:00:57,810
Dus een werkwijze gedraagt ​​op twee verschillende manieren.

12
00:00:57,960 --> 00:01:05,600
En dit paradigma is de getter en setter paradigma waar we een getter om informatie en een setter om een ​​nieuwe waarde in te stellen op te halen genaamd.

13
00:01:06,060 --> 00:01:08,520
Laten we eens een kijkje bij enkele van de voorbeelden hier.

14
00:01:08,520 --> 00:01:15,140
De G-code docs altijd uitstekende voorbeelden en documentatie en leerprogramma stijl schrijven.

15
00:01:15,150 --> 00:01:16,570
Dus laten we eens een kijkje hier.

16
00:01:16,710 --> 00:01:30,610
We hebben een beeld en het heeft een binnendiameter een bron en een alt-tekst, zodat we kunnen kiezen dat zo wij het beeld met een grote foto-ID geweldige foto dot H. kunt selecteren

17
00:01:31,050 --> 00:01:35,160
En we passeren in wat we proberen te veranderen wat Alt.

18
00:01:35,250 --> 00:01:45,050
En dan kunnen we overgaan in een nieuwe waarde en zie je ook hier beneden kunnen we TTR gebruiken om meerdere waarden in een keer of meerdere attributen.

19
00:01:45,120 --> 00:01:51,580
Dus we kunnen de tekst en de titel attribuut door het passeren van een object, net als de CSSA methode in te stellen.

20
00:01:51,880 --> 00:01:52,130
OK.

21
00:01:52,140 --> 00:01:53,540
Dus laten we spelen rond met dit.

22
00:01:53,820 --> 00:01:56,050
Hier is onze pagina we hebben gewerkt met.

23
00:01:56,130 --> 00:01:59,770
Ik ga toe te voegen in een beetje meer van elk team zal ik content.

24
00:01:59,790 --> 00:02:06,980
Dus op de bodem hier ga ik een afbeelding tag toe te voegen en de bron wordt mijn favoriete grenen martin zijn.

25
00:02:07,230 --> 00:02:08,460
Zo schattig.

26
00:02:08,460 --> 00:02:17,530
En wat we gaan doen is het gebruik J query en de TTR methode om dat imago bron tot de angstaanjagende grenen martin veranderen.

27
00:02:18,020 --> 00:02:18,620
OK.

28
00:02:18,930 --> 00:02:20,500
Dus Zullen onze pagina te vernieuwen.

29
00:02:20,630 --> 00:02:29,620
Hier is ons imago en wat zou een goede eerste oefening is om het beeld te selecteren en maken het een beetje meer beheersbaar dus kleiner.

30
00:02:29,780 --> 00:02:42,550
Dus we zullen het selecteren zien ons en we kunnen beginnen door alleen te kijken naar wat de breedte momenteel is dat 1133 pixels en laten we het een stuk kleiner.

31
00:02:42,630 --> 00:02:48,600
Dus we zullen veranderen met de 2 500 pixels, net als dat.

32
00:02:48,920 --> 00:02:50,780
OK, dat ziet er een stuk beter.

33
00:02:51,450 --> 00:02:57,050
En eigenlijk is dat een beetje kleiner en maanden zelfs tot 200.

34
00:02:57,060 --> 00:02:57,630
Daar gaan we.

35
00:02:57,720 --> 00:02:59,600
Daar is onze schattige grenen martin.

36
00:02:59,790 --> 00:03:04,150
Dus we TTR gebruiken om verder te gaan en verander het beeld bron.

37
00:03:04,350 --> 00:03:09,790
Dus moeten we het beeld opnieuw te selecteren als dat punt 8.

38
00:03:10,290 --> 00:03:14,580
En we kunnen de waarde van de bron te krijgen voor het eerst gewoon ophalen.

39
00:03:14,580 --> 00:03:25,380
Dit is het beeld bron en dan kunnen we het ook instellen door het passeren in onze tweede argument dat is de URL die ik gekopieerd en op mijn klembord en daar gaan we.

40
00:03:25,410 --> 00:03:26,830
Het automatisch bijgewerkt.

41
00:03:26,880 --> 00:03:29,910
En is er onze angstaanjagend grenen martin.

42
00:03:30,930 --> 00:03:32,460
Dus dat is een voorbeeld.

43
00:03:32,460 --> 00:03:41,110
Een ander ding dat we hier kunnen doen is het selecteren van deze input die soort gelijk is aan de tekst en we konden de waarde van het type attribuut te wijzigen.

44
00:03:41,280 --> 00:03:47,260
Dus we zullen dat hier ingang te doen en dan laten we eens kijken naar het attribuut.

45
00:03:47,400 --> 00:03:49,110
Nou laten we beginnen door alleen te kijken naar ingang.

46
00:03:49,170 --> 00:03:50,890
Het is de enige op de pagina.

47
00:03:51,270 --> 00:04:03,500
En dan zullen we dat doen attribuut type en we zien het type is de tekst en nu kunnen we spelen met het en veranderen dat type te zijn gekleurd.

48
00:04:03,720 --> 00:04:07,000
En let op deze ingang hier omdat ik druk op enter.

49
00:04:07,380 --> 00:04:11,670
Het verandert nu om een ​​kleur-ingang en we kunnen hetzelfde doen.

50
00:04:11,760 --> 00:04:15,340
Verander het deze keer om een ​​checkbox zijn.

51
00:04:15,360 --> 00:04:16,630
Daar gaan we.

52
00:04:17,430 --> 00:04:17,740
OK.

53
00:04:17,760 --> 00:04:23,890
Laten we terug gaan naar tekst, want we gaan dit later in de video te gebruiken als een tekstinvoer.

54
00:04:24,090 --> 00:04:32,700
Het laatste wat ik wil laten zien is het gedrag van de TR-methode op meerdere elementen dus laten we toe te voegen in een enkele afbeelding-tags.

55
00:04:32,820 --> 00:04:38,850
Dus we doen een twee drie beelden en ik ga moeten vernieuwen om die te krijgen.

56
00:04:39,000 --> 00:04:40,890
En die gigantische beelden.

57
00:04:40,980 --> 00:04:58,000
Dus ik ga weer verkleinen en die zullen worden Image stip SS met Khama 200 acts en vanwege de magie van J Query dat ze allemaal 200 pixels zal maken.

58
00:04:58,440 --> 00:05:05,070
OK laten we veronderstellen Ik wil de eerste enige veranderen hier om de enge boommarter foto met de tanden.

59
00:05:05,380 --> 00:05:14,620
Wat ik deed eerder zal niet werken als ik probeer en selecteert u het beeld dat is eigenlijk alle afbeeldingen en zo zal het alle drie van hun imago bronnen te veranderen.

60
00:05:14,610 --> 00:05:33,420
Dus als ik wil alleen de eerste die ik kan het colon gebruiken en te onthouden is er voor het eerst van het type als dat voor de ingebouwde J queery eerste die korter is, maar eigenlijk iets langzamer omdat het niet met behulp van een ingebouwde CSSA selector.

61
00:05:33,570 --> 00:05:40,010
Dus kom ik terug naar de eerste van het type te gaan en dan kunnen we de bron te wijzigen naar onze angstaanjagend beeld die je kent.

62
00:05:40,140 --> 00:05:44,250
En als ik druk op enter alleen die eerste afbeelding effecten.

63
00:05:44,670 --> 00:06:06,240
En als ik wilde het laatste beeld te updaten naar hetzelfde beeld bron hebben dit angstaanjagende pine martin Ik heb een paar opties en de eerste die ik zal laten zien is om alle beelden als dit te selecteren en gebruik vervolgens de stip laatste methode die iets je hebt nog niet gezien en dit zal het laatste element terug te keren van een bepaalde selector.

64
00:06:06,420 --> 00:06:16,820
Dus dit selecteert alle drie beelden en toen we vragen voor de laatste en dan kunnen we dat doen ATSDR bron en dan kunnen we plakken naar ons beeld bron en druk op enter.

65
00:06:17,070 --> 00:06:20,670
En je kunt zien dat het laatste beeld ook is veranderd.

66
00:06:20,700 --> 00:06:25,800
En dan tot slot zal ik laten zien veranderen van alle drie van hen samen, dus ik heb een nieuwe afbeelding die u bent.

67
00:06:25,830 --> 00:06:43,310
Ik zal hier kopiëren over en zal de bron attribuut op alle van hen te veranderen door gewoon de selectie van alle beelden als dit en dan loopt die eigenschap source komma en plakken in onze Nieuwe U bent allen en alle drie de afbeeldingen te wijzigen tegelijk.

68
00:06:43,750 --> 00:06:48,810
Dus om samen te vatten TTR als we slechts één argument als bron geven.

69
00:06:48,880 --> 00:06:51,020
Maar we weten niet passeren in een tweede argument.

70
00:06:51,090 --> 00:06:53,540
Het zal alleen de terugkeer van de waarde van de bron.

71
00:06:53,790 --> 00:06:54,810
Dus dat is de getter.

72
00:06:54,930 --> 00:07:06,070
En dan, als we een tweede argument als een nieuwe jij r l zoals wij hier deden die eigenlijk de waarde van de bron op elke element dat we eerder gekozen wordt bijgewerkt.

73
00:07:06,090 --> 00:07:10,020
Dus de volgende ding dat ik wil laten zien is het Vau methode.

74
00:07:10,020 --> 00:07:16,490
Dus VHDL wat Val doet is dat het helpt ons de waarde te halen uit een input.

75
00:07:16,530 --> 00:07:30,640
Dus als je kunt terug naar toen u dat scorer met gewoon javascript en we hadden dat aantal inbreng maakte denken en die ingang kon je de winnende score op te geven voor het spelen van 5 of 10 en we moesten om de waarde er uit te halen.

76
00:07:30,630 --> 00:07:33,010
We maken gebruik van een eigenschap waarde.

77
00:07:33,250 --> 00:07:38,160
Nou Vau is J vraagt ​​wrapper voor de waarde, net als elke tim.

78
00:07:38,190 --> 00:07:44,360
Het is een wrapper voor woedende Jamail en de tekst is de wrapper voor de inhoud van de tekst.

79
00:07:44,370 --> 00:07:47,630
U kunt een kijkje nemen op een paar voorbeelden te noemen zoals je hier kunt zien.

80
00:07:47,790 --> 00:07:53,950
Als we niet passeren alle argumenten zal het de waarde van een bepaald element dat we selecteren terugkeren.

81
00:07:54,490 --> 00:08:13,230
Dus in dit geval zijn we grijpen de dropdown menu aan de keuze-element met klasse van foo en dan zijn we Val doen op die zal ons vertellen welke element of welk deel van het dropdown wordt geselecteerd en dan kunnen we ook dezelfde syntaxis maar we pas in een argument en dat zal de waarde van een ingang te wijzigen.

82
00:08:13,240 --> 00:08:20,560
Dus laten we naar onze tekstinvoer hier en ik ga naar de console te wissen en we zullen doorgaan en selecteer deze tekstinvoer.

83
00:08:20,910 --> 00:08:28,090
Dus een dollarteken ingang net als dat en dan zullen we Val lopen zonder argumenten.

84
00:08:28,350 --> 00:08:33,420
En op dit moment zou het ons een lege string te geven omdat de waarde hier is een lege string.

85
00:08:33,420 --> 00:08:34,600
Er is niets binnen is er.

86
00:08:34,890 --> 00:08:41,900
Dus als we het type iets nu als mijn naam en toen we vragen voor de waarde vertelt het ons koud staal.

87
00:08:42,150 --> 00:08:51,290
Dus wat is hier wordt gegrepen toen we aanloop hoewel en dan net als alle andere methoden die we hebben gezien dat zal ook fungeren als een setter methode.

88
00:08:51,450 --> 00:09:03,070
Dus als ik pas in iets als roestig staal en ik druk op enter ik kan zien dat het werkt de input voor nu zeggen Resti nog steeds.

89
00:09:03,180 --> 00:09:07,320
U vraagt ​​zich misschien af ​​wanneer we eigenlijk code zou schrijven aan een ingang bij te werken.

90
00:09:07,330 --> 00:09:10,150
Meestal laten we een gebruiker de input te werken.

91
00:09:10,230 --> 00:09:14,630
De één gemeenschappelijk use case die ik kan bedenken is als we wilden om de waarde te wissen.

92
00:09:14,710 --> 00:09:31,670
Dus als dit een takenlijst en we wilden de gebruiker in staat zijn om nieuwe Candie's jelly beans die manier worden overschat door de manier toe te voegen of iets wat ik kon typen in en krijgen we druk op enter en we willen een nieuwe bondgenoot toe te voegen en vervolgens we willen doorhalen wat er binnen in hier.

93
00:09:31,840 --> 00:09:33,460
We zouden dot gebruiken.

94
00:09:33,540 --> 00:09:35,290
Dus ik zal je laten zien.

95
00:09:35,290 --> 00:09:36,290
Net ziet er zo uit.

96
00:09:36,390 --> 00:09:45,040
En dan gaan we deze ingesteld op een lege string en dat wist de inhoud binnen daar dus we zullen dat doen eigenlijk als we onze eigen lijst te doen.

97
00:09:45,080 --> 00:09:49,960
We zullen Vau te gebruiken met een lege string te resetten tekst en te zetten.

98
00:09:49,960 --> 00:09:54,890
Laatste wat ik zal noemen, is dat Darvell werkt op alle elementen die een waarde attribuut.

99
00:09:55,050 --> 00:10:16,850
Dus het is niet alleen ingangen met type noemt de tekst is het dingen zoals checkboxes en kleur voor kleur ingangen, maar het bevat ook dropdown menu's die ik verder kan gaan en schrijf een nieuw dropdown menu dat is een keuze-element te maken en vervolgens binnen deze selecte voegen we in opties en elke optie staat voor een keuze.

100
00:10:17,040 --> 00:10:28,210
Dus onze opties zullen enkele van de meest populaire huisdieren bevatten in het land, zoals struisvogel en schildpadden en Toad.

101
00:10:28,600 --> 00:10:44,600
OK en we zullen slaan en vernieuw de pagina en je kunt zien dat we nu een dropdown menu met drie keuzes en als ik wil weten welke keuze de gebruiker heeft gekozen kon ik hier gaan en ik niet alleen selecteren ingang elke meer.

102
00:10:44,790 --> 00:10:58,210
Ik zou moeten selecteren welke me dat dropdown menu zal geven te selecteren en dan heb ik alleen nog maar Vau op die en het vertelt me ​​dat de gebruiker heeft gekozen pad Oké.

103
00:10:58,230 --> 00:11:12,670
Dus om wrap up 80 TR wordt gebruikt om toegang te krijgen tot een specifieke eigenschap die we willen of om een ​​attribuut te stellen en vervolgens fĂźlle wordt gebruikt om de waarde te halen of de waarde van enige vorm van input of dropdown menu.