1
00:00:00,570 --> 00:00:01,430
Dar una buena acogida.

2
00:00:01,590 --> 00:00:06,000
En este video retomaremos donde lo dejamos y seguiremos hablando de algunos de estos

3
00:00:06,000 --> 00:00:11,220
métodos importantes que quiero mostrarles que el próximo que vamos a discutir es después de las ocho.

4
00:00:11,370 --> 00:00:16,290
Y es corto para el atributo así que voy a ir a los documentos y solo buscar atributos.

5
00:00:16,530 --> 00:00:19,550
Va a estar arriba aquí ETR.

6
00:00:19,680 --> 00:00:20,500
Aquí vamos.

7
00:00:20,730 --> 00:00:24,930
Y para lo que lo usamos es recuperar el valor de un atributo.

8
00:00:25,230 --> 00:00:30,510
elemento en un conjunto de elementos coincidentes o establece uno o más atributos para cada elemento coincidente.

9
00:00:30,540 --> 00:00:34,680
De acuerdo con los documentos, obtiene el valor de un atributo para el primer

10
00:00:34,680 --> 00:00:39,170
Entonces podemos recuperar un atributo o podemos establecer un atributo.

11
00:00:39,210 --> 00:00:45,240
Con suerte, ya se está notando un patrón donde con estos métodos podemos obtener información

12
00:00:45,360 --> 00:00:51,320
para recuperar un atributo o recuperar el estilo o recuperar el texto o enfurecerlo.

13
00:00:51,540 --> 00:00:55,610
Y luego también podemos establecerlos pasándole un argumento al método.

14
00:00:55,620 --> 00:00:57,810
Entonces, un método se comporta de dos maneras diferentes.

15
00:00:57,960 --> 00:01:02,970
Y este paradigma se llama el paradigma getter and setter, donde tenemos un getter para recuperar

16
00:01:03,000 --> 00:01:05,600
información y un setter para establecer un nuevo valor.

17
00:01:06,060 --> 00:01:08,520
Echemos un vistazo a algunos de los ejemplos aquí.

18
00:01:08,520 --> 00:01:15,140
Los documentos de código G siempre tienen excelentes ejemplos y documentación y escritura de estilo tutorial.

19
00:01:15,150 --> 00:01:16,570
Así que echemos un vistazo aquí.

20
00:01:16,710 --> 00:01:25,170
Tenemos una imagen y tiene un I. RE. una fuente y un texto alternativo para que podamos

21
00:01:25,170 --> 00:01:30,610
seleccionar eso para poder seleccionar la imagen con una gran identificación con foto gran foto punto H.

22
00:01:31,050 --> 00:01:35,160
Y pasamos por lo que intentamos cambiar, que es Alt.

23
00:01:35,250 --> 00:01:42,990
Y luego podemos pasarlo en un nuevo valor y también puede ver aquí. Podemos usar TTR para establecer múltiples valores a

24
00:01:42,990 --> 00:01:45,050
la vez o múltiples atributos.

25
00:01:45,120 --> 00:01:51,580
Así que podemos establecer el texto y el atributo del título pasando un objeto como el método CSSA.

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

27
00:01:52,140 --> 00:01:53,540
Así que juguemos con esto

28
00:01:53,820 --> 00:01:56,050
Aquí está nuestra página con la que hemos estado trabajando.

29
00:01:56,130 --> 00:01:59,770
Voy a agregar un poco más de cada equipo que contentaré.

30
00:01:59,790 --> 00:02:06,750
Así que en la parte inferior aquí voy a agregar una etiqueta de imagen y la fuente va a ser mi pino favorito.

31
00:02:07,230 --> 00:02:08,460
Muy adorable.

32
00:02:08,460 --> 00:02:16,500
vamos a hacer es usar la consulta J y el método TTR para cambiar esa fuente de imagen al aterrador pino martin.

33
00:02:16,560 --> 00:02:17,530
Y lo que

34
00:02:18,020 --> 00:02:18,620
DE ACUERDO.

35
00:02:18,930 --> 00:02:20,500
Entonces refrescará nuestra página.

36
00:02:20,630 --> 00:02:27,540
Aquí está nuestra imagen y lo que sería un buen primer ejercicio es seleccionar la imagen y hacerla un

37
00:02:27,540 --> 00:02:29,620
poco más manejable y más pequeña.

38
00:02:29,780 --> 00:02:37,740
Así que seleccionaremos la imagen y nos pondremos en contacto con nosotros, y podemos comenzar simplemente mirando qué ancho es actualmente,

39
00:02:38,070 --> 00:02:42,550
que es de 1133 píxeles y vamos a hacerlo mucho más pequeño.

40
00:02:42,630 --> 00:02:48,600
Así que cambiaremos con 2 500 píxeles simplemente así.

41
00:02:48,920 --> 00:02:50,780
OK, eso se ve mucho mejor.

42
00:02:51,450 --> 00:02:57,050
Y en realidad eso es un poco más pequeño y meses hasta 200.

43
00:02:57,060 --> 00:02:57,630
Aquí vamos.

44
00:02:57,720 --> 00:02:59,600
Está nuestro adorable pino Martin.

45
00:02:59,790 --> 00:03:04,150
Entonces usaremos TTR para seguir adelante y cambiar la fuente de la imagen.

46
00:03:04,350 --> 00:03:09,790
Entonces, necesitamos seleccionar la imagen nuevamente como ese punto 8.

47
00:03:10,290 --> 00:03:14,580
Y podemos obtener el valor de la fuente en primer lugar tan solo recuperarlo.

48
00:03:14,580 --> 00:03:21,060
pasando nuestro segundo argumento, que es la URL que copié y tengo en mi portapapeles, y ahí vamos.

49
00:03:21,210 --> 00:03:25,380
Esta es la fuente de la imagen y luego también podemos configurarla

50
00:03:25,410 --> 00:03:26,830
Se actualiza automáticamente.

51
00:03:26,880 --> 00:03:29,910
Y ahí está nuestro aterrador pino martin.

52
00:03:30,930 --> 00:03:32,460
Entonces ese es un ejemplo.

53
00:03:32,460 --> 00:03:38,850
Otra cosa que podríamos hacer aquí es seleccionar esta entrada, que es type es igual a text y

54
00:03:38,850 --> 00:03:41,110
podríamos cambiar el valor del atributo type.

55
00:03:41,280 --> 00:03:47,260
Así que haremos eso aquí, ingresaremos y luego veamos el atributo.

56
00:03:47,400 --> 00:03:49,110
Bueno, comencemos simplemente mirando la entrada.

57
00:03:49,170 --> 00:03:50,890
Es el único en la página.

58
00:03:51,270 --> 00:04:01,290
Y luego haremos ese tipo de atributo y veremos que el tipo es texto y ahora podemos jugar con él y cambiar eso para que

59
00:04:01,290 --> 00:04:03,500
el tipo sea de color.

60
00:04:03,720 --> 00:04:07,000
Y mire esta entrada aquí cuando pulso enter.

61
00:04:07,380 --> 00:04:11,670
Ahora cambia a una entrada de color y podemos hacer lo mismo.

62
00:04:11,760 --> 00:04:15,340
Cámbialo esta vez para ser una casilla de verificación.

63
00:04:15,360 --> 00:04:16,630
Aquí vamos.

64
00:04:17,430 --> 00:04:17,740
DE ACUERDO.

65
00:04:17,760 --> 00:04:23,890
Volvamos al texto porque lo usaremos más adelante en el video como entrada de texto.

66
00:04:24,090 --> 00:04:30,360
Lo último que quiero demostrar es el comportamiento del método TR en múltiples elementos, así

67
00:04:30,360 --> 00:04:32,700
que agreguemos algunas etiquetas de imagen.

68
00:04:32,820 --> 00:04:38,850
Así que haremos una dos tres imágenes y tendré que actualizar para obtenerlas.

69
00:04:39,000 --> 00:04:40,890
Y allí esas imágenes gigantescas.

70
00:04:40,980 --> 00:04:53,880
Así que voy a cambiar el tamaño de nuevo y eso será Image dot ver SS con actos de Khama 200 y debido a la magia de

71
00:04:53,880 --> 00:04:58,000
J Query que los hará a todos 200 píxeles.

72
00:04:58,440 --> 00:05:04,380
supongamos que solo quiero cambiar la primera aquí para que sea la foto aterradora de la marta de pino con los dientes.

73
00:05:04,380 --> 00:05:05,070
De acuerdo,

74
00:05:05,380 --> 00:05:12,120
Lo que hice antes no funcionará si lo intento y simplemente selecciono la imagen que en realidad son todas las imágenes, por lo

75
00:05:12,120 --> 00:05:14,620
que cambiará las tres fuentes de sus imágenes.

76
00:05:14,610 --> 00:05:23,460
Entonces, si solo quiero el primero, puedo usar dos puntos de imagen y recordar que primero hay uno de ese tipo para la

77
00:05:24,210 --> 00:05:31,380
primera versión de J queery, que es más corto pero en realidad un poco más lento porque no usa

78
00:05:31,620 --> 00:05:33,420
un selector de CSSA incorporado.

79
00:05:33,570 --> 00:05:40,010
Así que volveré al primero de tipo y luego podemos cambiar la fuente para que sea nuestra imagen de miedo, ya sabes.

80
00:05:40,140 --> 00:05:44,250
Y si pulso enter, solo afecta la primera imagen.

81
00:05:44,670 --> 00:05:51,060
Y si quería actualizar la última imagen para tener la misma fuente de imagen que este aterrador

82
00:05:51,060 --> 00:05:59,400
pino martin, tengo algunas opciones y la primera que mostraré es seleccionar todas las imágenes como esta y luego usar el último método

83
00:05:59,420 --> 00:06:05,280
de punto que es algo no has visto aún y esto devolverá el último elemento de

84
00:06:05,280 --> 00:06:06,240
un selector determinado.

85
00:06:06,420 --> 00:06:12,240
Así que esto selecciona las tres imágenes y luego estamos pidiendo la última y luego podemos hacer esa fuente

86
00:06:12,750 --> 00:06:16,820
ATSDR y luego podemos pegar en nuestra fuente de imagen y pulsar enter.

87
00:06:17,070 --> 00:06:20,670
Y puedes ver que la última imagen también ha cambiado.

88
00:06:20,700 --> 00:06:25,800
Y, finalmente, demostraré que cambié a los tres juntos, así que tengo una nueva imagen.

89
00:06:25,830 --> 00:06:32,440
Copiaré aquí y cambiaré el atributo de fuente en todos ellos simplemente seleccionando todas las imágenes

90
00:06:33,960 --> 00:06:41,280
como esta y luego ejecutando esa coma fuente de atributo y pegando en nuestro Nuevo Tú. Todas

91
00:06:41,280 --> 00:06:43,310
las tres imágenes cambian simultáneamente.

92
00:06:43,750 --> 00:06:48,810
Entonces, resumir TTR si solo le damos un argumento como fuente.

93
00:06:48,880 --> 00:06:51,020
Pero no pasamos en un segundo argumento.

94
00:06:51,090 --> 00:06:53,540
Simplemente devolverá el valor de la fuente.

95
00:06:53,790 --> 00:06:54,810
Entonces ese es el captador.

96
00:06:54,930 --> 00:07:00,450
actualizará el valor de la fuente en cada elemento que hayamos seleccionado previamente.

97
00:07:00,450 --> 00:07:06,070
Y luego, si proporcionamos un segundo argumento como nuevo, como lo hicimos aquí, realmente

98
00:07:06,090 --> 00:07:10,020
Entonces, lo próximo que quiero demostrar es el método Vau.

99
00:07:10,020 --> 00:07:16,490
Entonces, VHDL, lo que Val hace es que nos ayuda a extraer el valor de una entrada.

100
00:07:16,530 --> 00:07:22,200
Entonces, si puedes recordar cuándo hiciste ese scorekeeper con javascript simple y tuvimos esa entrada de

101
00:07:22,290 --> 00:07:28,740
número y esa entrada, pudiste especificar la puntuación ganadora para jugar a 5 o a 10 y necesitábamos

102
00:07:28,750 --> 00:07:30,640
extraer el valor de allí.

103
00:07:30,630 --> 00:07:33,010
Usamos una propiedad llamada valor.

104
00:07:33,250 --> 00:07:38,160
Bueno, Vau es el envoltorio de consultas de J por valor al igual que cada momento.

105
00:07:38,190 --> 00:07:44,360
Es un envoltorio para Jamail enfurecido y el texto es el contenedor para el contenido de texto.

106
00:07:44,370 --> 00:07:47,630
Puede ver algunos ejemplos como puede ver aquí.

107
00:07:47,790 --> 00:07:53,950
Si no pasamos ningún argumento, devolverá el valor de un elemento en particular que seleccionemos.

108
00:07:54,490 --> 00:08:00,480
Entonces en este caso estamos agarrando el menú desplegable en el elemento select con la clase de foo y

109
00:08:00,490 --> 00:08:06,990
luego estamos haciendo Val en él que nos dirá qué elemento o qué parte del menú desplegable se selecciona y luego

110
00:08:07,000 --> 00:08:12,720
también podemos usar la misma sintaxis pero pasamos una discusión y eso cambiará el valor de una entrada.

111
00:08:13,240 --> 00:08:18,870
Así que vamos a nuestra entrada de texto aquí y voy a borrar la consola y vamos a seguir adelante

112
00:08:19,020 --> 00:08:20,560
y seleccionar esta entrada de texto.

113
00:08:20,910 --> 00:08:28,090
Así que una entrada de signo de dólar así y luego ejecutaremos Val sin argumentos.

114
00:08:28,350 --> 00:08:33,420
Y ahora mismo nos daría una cadena vacía porque el valor aquí es una cadena vacía.

115
00:08:33,420 --> 00:08:34,600
No hay nada adentro.

116
00:08:34,890 --> 00:08:41,900
Entonces, si escribimos algo como mi nombre y luego pedimos el valor que nos dice el acero frío.

117
00:08:42,150 --> 00:08:48,720
Entonces, lo que sea que esté aquí se agarra cuando se nos acaba y luego, como todos los otros métodos que

118
00:08:48,900 --> 00:08:51,290
hemos visto, también actuará como un método setter.

119
00:08:51,450 --> 00:09:01,080
Entonces, si paso algo como acero oxidado y presiono enter, puedo ver que actualiza la entrada para

120
00:09:01,090 --> 00:09:03,070
decir ahora resti still.

121
00:09:03,180 --> 00:09:07,320
Es posible que se pregunte cuándo escribiríamos código para actualizar una entrada.

122
00:09:07,330 --> 00:09:10,150
Por lo general, permitimos que un usuario actualice la entrada.

123
00:09:10,230 --> 00:09:14,630
El único caso de uso común en el que puedo pensar es si queríamos borrar el valor.

124
00:09:14,710 --> 00:09:20,550
Entonces, si esta era una lista de tareas pendientes y queríamos que el usuario pudiera agregar nuevos Candie o

125
00:09:20,550 --> 00:09:28,410
algo así, podía escribir en pastillas de goma que estaban demasiado sobrevaloradas por cierto y recibimos el botón enter y queremos agregar un nuevo aliado

126
00:09:28,420 --> 00:09:31,670
y luego Queremos eliminar lo que hay dentro de aquí.

127
00:09:31,840 --> 00:09:33,460
Nosotros usaríamos dot.

128
00:09:33,540 --> 00:09:35,290
Así que te mostraré.

129
00:09:35,290 --> 00:09:36,290
Solo se ve así.

130
00:09:36,390 --> 00:09:42,490
Y luego vamos a configurarlo en una cadena vacía y eso borra el contenido dentro de allí, así que lo

131
00:09:42,480 --> 00:09:45,040
haremos cuando hagamos nuestra propia lista de tareas pendientes.

132
00:09:45,080 --> 00:09:49,960
Usaremos Vau con una cadena vacía para restablecer el texto y ponerlo.

133
00:09:49,960 --> 00:09:54,890
Lo último que mencionaré es que Darvell trabaja en todos los elementos que tienen un atributo de valor.

134
00:09:55,050 --> 00:10:01,170
Por lo tanto, no se trata solo de entradas con texto de tipo llamadas, como casillas de

135
00:10:01,410 --> 00:10:07,110
verificación y color para entradas de color, sino que también incluye menús desplegables que puedo escribir

136
00:10:07,120 --> 00:10:16,740
y crear un nuevo menú desplegable que es un elemento seleccionado y luego dentro de este seleccionar lo agregamos opciones y cada opción representa una elección.

137
00:10:17,040 --> 00:10:27,480
Por lo tanto, nuestras opciones contendrán algunas de las mascotas más populares del país, como el avestruz, la tortuga y el

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

139
00:10:28,600 --> 00:10:35,950
De acuerdo, guardaremos y actualizaremos la página y podrá ver que ahora tenemos un menú desplegable con tres

140
00:10:36,140 --> 00:10:43,080
opciones y si quiero saber qué opción ha seleccionado el usuario, podría ir aquí y no solo

141
00:10:43,330 --> 00:10:44,600
seleccionar ninguna entrada. Más.

142
00:10:44,790 --> 00:10:53,070
Tendría que seleccionar ya sea seleccionar que me dará ese menú desplegable y luego simplemente ejecutar Vau en

143
00:10:53,080 --> 00:10:58,210
eso y me dice que el usuario ha seleccionado sapo bien.

144
00:10:58,230 --> 00:11:06,250
un atributo y luego fĂźlle se usa para recuperar el valor o establecer el valor de cualquier tipo de entrada o menú desplegable.

145
00:11:06,240 --> 00:11:12,670
Entonces, para envolver 80 TR se usa para acceder a cualquier atributo específico que queramos o para establecer

146
00:11:13,110 --> 00:11:13,500
Todo bien