1
00:00:00,570 --> 00:00:01,430
Ben tornato.

2
00:00:01,590 --> 00:00:06,000
In questo video riprenderemo da dove eravamo rimasti e continuiamo a parlare di

3
00:00:06,000 --> 00:00:11,220
alcuni di questi importanti metodi che voglio mostrare il prossimo che discuteremo dopo le otto.

4
00:00:11,370 --> 00:00:16,290
Ed è abbreviazione di attributo, quindi ho intenzione di andare alla documentazione e cercare gli attributi.

5
00:00:16,530 --> 00:00:19,550
Sta andando in cima qui ETR.

6
00:00:19,680 --> 00:00:20,500
Eccoci.

7
00:00:20,730 --> 00:00:24,930
E per cosa lo usiamo è recuperare il valore di un attributo.

8
00:00:25,230 --> 00:00:30,510
elemento in un insieme di elementi corrispondenti o imposta uno o più attributi per ogni elemento abbinato.

9
00:00:30,540 --> 00:00:34,680
Quindi, secondo i documenti, ottiene il valore di un attributo per il primo

10
00:00:34,680 --> 00:00:39,170
Quindi possiamo recuperare un attributo o possiamo impostare un attributo.

11
00:00:39,210 --> 00:00:45,240
Si spera che tu stia già notando un modello in cui con questi metodi possiamo ottenere

12
00:00:45,360 --> 00:00:51,320
informazioni recuperare un attributo o recuperare lo stile o recuperare il testo o farlo infuriare.

13
00:00:51,540 --> 00:00:55,610
E poi possiamo anche impostarli passando un argomento al metodo.

14
00:00:55,620 --> 00:00:57,810
Quindi un metodo si comporta in due modi diversi.

15
00:00:57,960 --> 00:01:02,970
E questo paradigma è chiamato il paradigma getter and setter in cui abbiamo un getter per recuperare

16
00:01:03,000 --> 00:01:05,600
informazioni e un setter per impostare un nuovo valore.

17
00:01:06,060 --> 00:01:08,520
Diamo un'occhiata ad alcuni degli esempi qui.

18
00:01:08,520 --> 00:01:15,140
I documenti G-code hanno sempre esempi eccellenti e documentazione e scrittura in stile tutorial.

19
00:01:15,150 --> 00:01:16,570
Quindi diamo un'occhiata qui.

20
00:01:16,710 --> 00:01:25,170
Abbiamo un'immagine e ha un io D. una fonte e un testo alternativo in modo che

21
00:01:25,170 --> 00:01:30,610
possiamo selezionarlo in modo da poter selezionare l'immagine con un ottimo ID foto ottima foto punto H.

22
00:01:31,050 --> 00:01:35,160
E passiamo a ciò che stiamo cercando di cambiare, che è Alt.

23
00:01:35,250 --> 00:01:42,990
E poi possiamo passarlo in un nuovo valore e puoi anche vedere quaggiù possiamo usare TTR per impostare più

24
00:01:42,990 --> 00:01:45,050
valori contemporaneamente o più attributi.

25
00:01:45,120 --> 00:01:51,580
Quindi possiamo impostare il testo e l'attributo titolo passando un oggetto proprio come il metodo CSSA.

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

27
00:01:52,140 --> 00:01:53,540
Quindi giochiamo con questo.

28
00:01:53,820 --> 00:01:56,050
Ecco la nostra pagina con cui abbiamo lavorato.

29
00:01:56,130 --> 00:01:59,770
Aggiungerò un po 'di più ad ogni squadra che accontenterò.

30
00:01:59,790 --> 00:02:06,750
Quindi in fondo qui aggiungerò un tag immagine e la fonte sarà la mia pinna preferita.

31
00:02:07,230 --> 00:02:08,460
Così adorabile.

32
00:02:08,460 --> 00:02:16,500
che faremo è usare la query J e il metodo TTR per cambiare quella sorgente di immagini alla terrificante pine martin.

33
00:02:16,560 --> 00:02:17,530
E quello

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

35
00:02:18,930 --> 00:02:20,500
Così aggiorneremo la nostra pagina.

36
00:02:20,630 --> 00:02:27,540
Ecco la nostra immagine e quale sarebbe un buon primo esercizio è quello di selezionare l'immagine e renderla un po

37
00:02:27,540 --> 00:02:29,620
'più gestibile in modo più piccolo.

38
00:02:29,780 --> 00:02:37,740
Quindi selezioneremo l'immagine e possiamo iniziare osservando la larghezza attuale di 1133

39
00:02:38,070 --> 00:02:42,550
pixel e rendiamola molto più piccola.

40
00:02:42,630 --> 00:02:48,600
Quindi cambieremo con 2 500 pixel proprio così.

41
00:02:48,920 --> 00:02:50,780
OK, sembra molto meglio.

42
00:02:51,450 --> 00:02:57,050
E in realtà questo è un po 'più piccolo e mesi anche a 200.

43
00:02:57,060 --> 00:02:57,630
Eccoci.

44
00:02:57,720 --> 00:02:59,600
C'è la nostra adorabile pino martino.

45
00:02:59,790 --> 00:03:04,150
Quindi useremo TTR per andare avanti e cambiare la sorgente dell'immagine.

46
00:03:04,350 --> 00:03:09,790
Quindi dobbiamo selezionare nuovamente l'immagine come quel punto 8.

47
00:03:10,290 --> 00:03:14,580
E possiamo ottenere il valore della fonte prima di recuperarlo.

48
00:03:14,580 --> 00:03:21,060
nostro secondo argomento che è l'URL che ho copiato e che ho nei miei appunti e ci siamo.

49
00:03:21,210 --> 00:03:25,380
Questa è la fonte dell'immagine e quindi possiamo anche impostarla passando il

50
00:03:25,410 --> 00:03:26,830
Si aggiorna automaticamente.

51
00:03:26,880 --> 00:03:29,910
E c'è il nostro terrificante pino martino.

52
00:03:30,930 --> 00:03:32,460
Quindi questo è un esempio.

53
00:03:32,460 --> 00:03:38,850
Un'altra cosa che potremmo fare qui è selezionare questo input che è di tipo uguale al testo e

54
00:03:38,850 --> 00:03:41,110
potremmo cambiare il valore dell'attributo type.

55
00:03:41,280 --> 00:03:47,260
Quindi lo faremo qui in input e quindi guardiamo all'attributo.

56
00:03:47,400 --> 00:03:49,110
Bene, iniziamo guardando solo l'input.

57
00:03:49,170 --> 00:03:50,890
È l'unico nella pagina.

58
00:03:51,270 --> 00:04:01,290
E poi faremo quel tipo di attributo e vediamo che il testo è testo e ora possiamo giocarci e cambiarlo in modo

59
00:04:01,290 --> 00:04:03,500
che il testo sia colorato.

60
00:04:03,720 --> 00:04:07,000
E guarda questo input qui quando premo invio.

61
00:04:07,380 --> 00:04:11,670
Ora cambia in un input di colore e possiamo fare la stessa cosa.

62
00:04:11,760 --> 00:04:15,340
Cambia questa volta per essere una casella di controllo.

63
00:04:15,360 --> 00:04:16,630
Eccoci.

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

65
00:04:17,760 --> 00:04:23,890
Torniamo al testo perché lo utilizzeremo più avanti nel video come input di testo.

66
00:04:24,090 --> 00:04:30,360
L'ultima cosa che voglio dimostrare è il comportamento del metodo TR su più elementi,

67
00:04:30,360 --> 00:04:32,700
quindi aggiungiamo alcuni tag immagine.

68
00:04:32,820 --> 00:04:38,850
Quindi faremo due tre immagini e avrò bisogno di aggiornare per ottenere quelle.

69
00:04:39,000 --> 00:04:40,890
E lì quelle immagini gigantesche.

70
00:04:40,980 --> 00:04:53,880
Quindi ho intenzione di ridimensionare di nuovo e quello sarà Image dot vedere SS con Khama 200 atti e grazie alla magia di

71
00:04:53,880 --> 00:04:58,000
J Query che renderà tutti loro 200 pixel.

72
00:04:58,440 --> 00:05:04,380
che voglio solo cambiare la prima qui per essere la foto della martora di pino con i denti.

73
00:05:04,380 --> 00:05:05,070
OK supponiamo

74
00:05:05,380 --> 00:05:12,120
Quello che ho fatto prima non funzionerà se provo e seleziono solo l'immagine che è in realtà tutte le immagini e quindi cambierà

75
00:05:12,120 --> 00:05:14,620
tutte e tre le loro sorgenti di immagini.

76
00:05:14,610 --> 00:05:23,460
Quindi, se desidero solo il primo, posso usare i due punti dell'immagine e ricordare che per prima cosa è il primo di tipo

77
00:05:24,210 --> 00:05:31,380
simile a quello già compilato da J queery, che è più corto ma leggermente più lento perché non utilizza

78
00:05:31,620 --> 00:05:33,420
un selettore CSSA incorporato.

79
00:05:33,570 --> 00:05:40,010
Quindi tornerò al primo tipo e poi potremo cambiare fonte per diventare la nostra immagine paurosa che conosci.

80
00:05:40,140 --> 00:05:44,250
E se premo invio, ciò influisce solo sulla prima immagine.

81
00:05:44,670 --> 00:05:51,060
E se volevo aggiornare l'ultima immagine per avere la stessa fonte di immagine di questa terrificante pinna

82
00:05:51,060 --> 00:05:59,400
di pino, ho alcune opzioni e la prima che mostrerò è selezionare tutte le immagini come questa e poi usare l'ultimo metodo

83
00:05:59,420 --> 00:06:05,280
punto che è qualcosa non hai ancora visto e questo restituirà l'ultimo elemento da un

84
00:06:05,280 --> 00:06:06,240
dato selettore.

85
00:06:06,420 --> 00:06:12,240
Quindi questo seleziona tutte e tre le immagini e poi chiediamo l'ultima e poi possiamo fare quella fonte

86
00:06:12,750 --> 00:06:16,820
ATSDR e poi possiamo incollare la nostra fonte d'immagine e premere invio.

87
00:06:17,070 --> 00:06:20,670
E puoi vedere che anche l'ultima immagine è cambiata.

88
00:06:20,700 --> 00:06:25,800
E infine dimostrerò di cambiarli tutti e tre insieme, quindi ho una nuova immagine che sei.

89
00:06:25,830 --> 00:06:32,440
Copierò qui e cambierò l'attributo sorgente su tutti loro semplicemente selezionando tutte le immagini come questa

90
00:06:33,960 --> 00:06:41,280
e quindi eseguendo tale attributo fonte virgola e incolla nel nostro Nuovo Sei tutte e tutte e

91
00:06:41,280 --> 00:06:43,310
tre le immagini cambiano contemporaneamente.

92
00:06:43,750 --> 00:06:48,810
Quindi per riassumere TTR se gli diamo solo un argomento come la fonte.

93
00:06:48,880 --> 00:06:51,020
Ma non passiamo in una seconda discussione.

94
00:06:51,090 --> 00:06:53,540
Restituirà solo il valore della fonte.

95
00:06:53,790 --> 00:06:54,810
Quindi questo è il getter.

96
00:06:54,930 --> 00:07:00,450
qui, aggiorneremo il valore del sorgente su ogni singolo elemento che abbiamo selezionato in precedenza.

97
00:07:00,450 --> 00:07:06,070
E poi se forniamo un secondo argomento come un nuovo come quello che abbiamo fatto

98
00:07:06,090 --> 00:07:10,020
Quindi la prossima cosa che voglio dimostrare è il metodo Vau.

99
00:07:10,020 --> 00:07:16,490
Quindi VHDL quello che Val fa è che ci aiuta a estrarre il valore da un input.

100
00:07:16,530 --> 00:07:22,200
Quindi, se riesci a ripensare a quando hai fatto quel segnapunti con un semplice javascript e abbiamo

101
00:07:22,290 --> 00:07:28,740
inserito quel numero e quell'input potresti specificare il punteggio vincente per giocare a 5 o a 10 e abbiamo bisogno

102
00:07:28,750 --> 00:07:30,640
di estrarre il valore da lì.

103
00:07:30,630 --> 00:07:33,010
Usiamo una proprietà chiamata valore.

104
00:07:33,250 --> 00:07:38,160
Bene Vau è un wrapper J queries per valore proprio come ogni tim.

105
00:07:38,190 --> 00:07:44,360
È un wrapper per Jamail infuriato e text è il wrapper per il contenuto del testo.

106
00:07:44,370 --> 00:07:47,630
Puoi dare un'occhiata ad alcuni esempi come puoi vedere qui.

107
00:07:47,790 --> 00:07:53,950
Se non passiamo argomenti, restituirà il valore di un particolare elemento che selezioniamo.

108
00:07:54,490 --> 00:08:00,480
Quindi in questo caso stiamo prendendo il menu a discesa sull'elemento select con la classe di foo e quindi

109
00:08:00,490 --> 00:08:06,990
stiamo facendo Val su di esso che ci dirà quale elemento o quale parte del menu a discesa è selezionato e

110
00:08:07,000 --> 00:08:12,720
quindi possiamo anche usare la stessa sintassi ma passiamo un argomento e questo cambierà il valore di un input.

111
00:08:13,240 --> 00:08:18,870
Quindi andiamo al nostro input di testo qui e ho intenzione di cancellare la console e andremo avanti e

112
00:08:19,020 --> 00:08:20,560
selezionare questo input di testo.

113
00:08:20,910 --> 00:08:28,090
Quindi un input per il simbolo del dollaro è fatto così e quindi eseguiremo Val senza argomenti.

114
00:08:28,350 --> 00:08:33,420
E in questo momento ci darebbe una stringa vuota perché il valore qui è una stringa vuota.

115
00:08:33,420 --> 00:08:34,600
Non c'è niente lì dentro.

116
00:08:34,890 --> 00:08:41,900
Quindi se scriviamo qualcosa come il mio nome e poi chiediamo il valore che ci dice freddo acciaio.

117
00:08:42,150 --> 00:08:48,720
Quindi qualunque cosa sia qui viene afferrata quando siamo in esecuzione e poi, come tutti gli altri metodi che

118
00:08:48,900 --> 00:08:51,290
abbiamo visto, fungerà anche da metodo setter.

119
00:08:51,450 --> 00:09:01,080
Quindi se passo in qualcosa di simile a un acciaio arrugginito e premo invio, posso vedere che aggiorna l'input

120
00:09:01,090 --> 00:09:03,070
per dire ancora resti.

121
00:09:03,180 --> 00:09:07,320
Ci si potrebbe chiedere quando effettivamente scriveremo codice per aggiornare un input.

122
00:09:07,330 --> 00:09:10,150
Di solito permettiamo ad un utente di aggiornare l'input.

123
00:09:10,230 --> 00:09:14,630
L'unico caso di uso comune a cui posso pensare è se volessimo cancellare il valore.

124
00:09:14,710 --> 00:09:20,550
Quindi, se questa era una lista delle cose da fare e volevamo che l'utente fosse in grado di

125
00:09:20,550 --> 00:09:28,410
aggiungere nuove Candie o qualcosa potrei digitare in jelly bean che sono sopravvalutati e allora siamo entrati in hit e vogliamo aggiungere un nuovo

126
00:09:28,420 --> 00:09:31,670
alleato e poi vogliamo eliminare cosa c'è dentro di qui.

127
00:09:31,840 --> 00:09:33,460
Useremmo il punto.

128
00:09:33,540 --> 00:09:35,290
Quindi ti mostrerò.

129
00:09:35,290 --> 00:09:36,290
Sembra proprio questo

130
00:09:36,390 --> 00:09:42,490
E poi lo imposterai su una stringa vuota e questo cancellerebbe il contenuto al suo interno, così lo faremo effettivamente

131
00:09:42,480 --> 00:09:45,040
quando creeremo il nostro elenco di cose da fare.

132
00:09:45,080 --> 00:09:49,960
Useremo Vau con una stringa vuota per reimpostare il testo e mettere.

133
00:09:49,960 --> 00:09:54,890
L'ultima cosa che menzionerò è che Darvell funziona su tutti gli elementi che hanno un attributo value.

134
00:09:55,050 --> 00:10:01,170
Quindi non sono solo gli input con testo di tipo call, sono cose come checkbox e colore

135
00:10:01,410 --> 00:10:07,110
per gli input a colori, ma include anche menu a discesa che posso andare avanti e

136
00:10:07,120 --> 00:10:16,740
scrivere creerà un nuovo menu a tendina che è un elemento select e quindi all'interno di questa selezione aggiungiamo opzioni e ogni opzione rappresenta una scelta.

137
00:10:17,040 --> 00:10:27,480
Quindi le nostre opzioni conterranno alcuni degli animali domestici più popolari del paese come struzzo, tartaruga e

138
00:10:27,480 --> 00:10:28,210
rospo.

139
00:10:28,600 --> 00:10:35,950
OK e salveremo e aggiorneremo la pagina e vedremo che ora abbiamo un menu a discesa con tre

140
00:10:36,140 --> 00:10:43,080
scelte e se voglio sapere quale scelta l'utente ha selezionato potrei andare qui e non selezionare solo

141
00:10:43,330 --> 00:10:44,600
input Di Più.

142
00:10:44,790 --> 00:10:53,070
Avrei bisogno di selezionare o selezionare quale mi darà quel menu a tendina e poi eseguirò Vau su quello

143
00:10:53,080 --> 00:10:58,210
e mi dice che l'utente ha selezionato il rospo Va bene.

144
00:10:58,230 --> 00:11:06,250
attributo e quindi fĂźlle viene utilizzato per recuperare il valore o impostare il valore di qualsiasi tipo di input o menu a discesa.

145
00:11:06,240 --> 00:11:12,670
Quindi per concludere 80 TR viene utilizzato per accedere a qualsiasi attributo specifico che vogliamo o per impostare un

146
00:11:13,110 --> 00:11:13,500
Tutto ok