DOM tree by dev-balza · Pull Request #264 · javascript-tutorial/es.javascript.info

dev-balza · 2020-06-19T22:09:52Z

Listo la traducción de los archivos contenidos en la carpeta asignada

First translation

translation #2

CLAassistant · 2020-06-19T22:09:56Z

All committers have signed the CLA.

javascript-translate-bot · 2020-06-20T15:11:13Z

Please make the requested changes. After it, add a comment "/done".
Then I'll ask for a new review 👻

EzequielCaste · 2020-06-20T15:19:59Z

@cortizg estoy revisando...

EzequielCaste · 2020-06-20T15:20:15Z

digo para no hacer 2 revisiones a la vez

EzequielCaste

algunos cambios

EzequielCaste · 2020-06-20T13:29:32Z

+document.body.style.background = 'red'; // establece un color de fondo rojo

-setTimeout(() => document.body.style.background = '', 3000); // return back
+setTimeout(() => document.body.style.background = '', 3000); // devolución


Suggested change
setTimeout(() => document.body.style.background = '', 3000); // devolución
setTimeout(() => document.body.style.background = '', 3000); // volver atrás
en este caso no se trata de una devolución, sino de volver al color original

EzequielCaste · 2020-06-20T13:30:41Z

- `offsetWidth` -- the node width (in pixels)
- ...and so on.
+- `innerHTML` -- contenido HTML del nodo.
+- `offsetWidth` -- anchura del nodo (en píxeles).


Suggested change
-`offsetWidth` -- anchura del nodo (en píxeles).
-`offsetWidth` -- ancho del nodo (en píxeles).

EzequielCaste · 2020-06-20T13:32:38Z

+## Un ejemplo del DOM

-Let's start with the following simple document:
+Comencemos con un documento sencillo, descrito a continuación:


Suggested change
Comencemos con un documento sencillo, descrito a continuación:
Comencemos con el siguiente documento simple:

EzequielCaste · 2020-06-20T13:33:28Z

+Comencemos con un documento sencillo, descrito a continuación:

-```html run no-beautify
+```ejecución html sin formatear


Suggested change
```ejecuciónhtml sin formatear
```htmlrun no-beautify
éste código no se debe traducir, es código interno

EzequielCaste · 2020-06-20T13:37:47Z


-```online
-On the picture above, you can click on element nodes and their children will open/collapse.
+```conectado


Suggested change
```conectado
```online

EzequielCaste · 2020-06-20T14:39:03Z

+1. `document` -- el "punto de entrada" en el DOM.
+2. nodos de elementos -- Etiquetas-HTML, los bloques construcción del árbol.
+3. nodos de texto -- contienen texto.
+4. comentarios -- a veces podemos colocar ocasiones información allí, no se mostrará, pero JS puede leerla desde el DOM.


Suggested change
4. comentarios -- a veces podemos colocar ocasiones información allí, no se mostrará, pero JS puede leerla desde el DOM.
4. comentarios -- a veces podemos colocar información allí, no se mostrará, pero JS puede leerla desde el DOM.

EzequielCaste · 2020-06-20T14:47:18Z

+## Véalo usted mismo

-To see the DOM structure in real-time, try [Live DOM Viewer](http://software.hixie.ch/utilities/js/live-dom-viewer/). Just type in the document, and it will show up as a DOM at an instant.
+Para ver la estructura del DOM en tiempo real, intente [visor en vivo del DOM](http://software.hixie.ch/utilities/js/live-dom-viewer/). Simplemente escriba el documento, y se mostrará como un DOM al instante.


Suggested change
Para ver la estructura del DOM en tiempo real, intente [visor en vivo del DOM](http://software.hixie.ch/utilities/js/live-dom-viewer/). Simplemente escriba el documento, y se mostrará como un DOM al instante.
Para ver la estructura del DOM en tiempo real, intente [Live DOM Viewer](http://software.hixie.ch/utilities/js/live-dom-viewer/). Simplemente escriba el documento, y se mostrará como un DOM al instante.

EzequielCaste · 2020-06-20T14:48:12Z

 ![](elk.svg)

-You can see the DOM, click on elements, see their details and so on.
+Puedes mirar el DOM, hacer clic sobre los elementos, ver sus detalles, etc.


Suggested change
Puedes mirar el DOM, hacer clic sobre los elementos, ver sus detalles, etc.
Puedes ver el DOM, hacer clic sobre los elementos, ver sus detalles, etc.

EzequielCaste · 2020-06-20T14:50:11Z

+Hacer clic en el botón <span class="devtools" style="background-position:-328px -124px"></span> ubicado en la esquina superior izquierda nos permite elegir un nodo desde la página web utilizando un "mouse" (u otros dispositivos de puntero) e "inspeccionar" (desplazarse hasta él en la pestaña elementos). Esto funciona muy bien cuando tenemmos una página HTML enorme (y el DOM correspondiente es enorme) y nos gustaría ver la posición de un elemento en particular.

-Another way to do it would be just right-clicking on a webpage and selecting "Inspect" in the context menu.
+Otra forma de realizarlo sería hacer clic derecho en la página web y en el menú contextual elegir la opción "inspeccionar".


Suggested change
Otra forma de realizarlo sería hacer clic derecho en la página web y en el menú contextual elegir la opción "inspeccionar".
Otra forma de realizarlo sería hacer clic derecho en la página web y en el menú contextual elegir la opción "Inspeccionar Elemento".

nótese que la palabra fue escrita con mayúscula en el documento original, denotando que se trata de el nombre oficial o predeterminado en el navegador Chrome. "Inspect" en la versión español el navegador tiene "Inspeccionar Elemento"

EzequielCaste · 2020-06-20T15:19:13Z

+En la parte derecha de las herramientos encontramos las siguientes sub-pestañas:
+- **Styles** -- podemos ver CSS aplicado al elemento actual regla por regla, incluidas las reglas integradas (gris). Casi todo puede ser editado en el lugar, incluyendo las dimensiones/márgenes/relleno de la siguiente caja.
+- **Computed** -- nos permite ver cada propiedad CSS aplicada al elemento: para cada propiedad podemos ver la regla que la provee (inluida la herencia CSS y demás).
+- **Event Listeners** -- nos ayuda a ver los escuchadores de eventos adjuntos a elementos del DOM (los cubriremos en la siguiente parte del tutorial).


Suggested change
-**Event Listeners** -- nos ayuda a ver los escuchadores de eventos adjuntos a elementos del DOM (los cubriremos en la siguiente parte del tutorial).
-**Event Listeners** -- nos ayuda a ver los listener de eventos adjuntos a elementos del DOM (los cubriremos en la siguiente parte del tutorial).
Estoy viendo que en MDN están usando listener

javascript-translate-bot · 2020-06-20T15:24:22Z

Please make the requested changes. After it, add a comment "/done".
Then I'll ask for a new review 👻

cortizg

hay comentario y cambios necesarios

javascript-translate-bot · 2020-06-20T15:24:39Z

Please make the requested changes. After it, add a comment "/done".
Then I'll ask for a new review 👻

cortizg

otras observaciones

cortizg · 2020-06-20T15:38:22Z

- <!-- comment -->
+ <!-- comentario -->
 */!*
 <li>...and cunning animal!</li>


Suggested change
<li>...and cunning animal!</li>
<li>...y el astuto animal!</li>

javascript-translate-bot · 2020-06-20T15:48:38Z

Please make the requested changes. After it, add a comment "/done".
Then I'll ask for a new review 👻

cortizg

mejor como review

javascript-translate-bot · 2020-06-20T15:53:40Z

Please make the requested changes. After it, add a comment "/done".
Then I'll ask for a new review 👻

Co-authored-by: Carlos Ortiz Gutiérrez <56600925+cortizg@users.noreply.github.com>

EzequielCaste

necesito una segunda opinión

javascript-translate-bot · 2020-06-20T20:29:35Z

Please make the requested changes. After it, add a comment "/done".
Then I'll ask for a new review 👻

/done

cortizg · 2020-06-20T23:34:11Z

/done

vplentinax · 2020-06-24T16:04:50Z

Una vez vean aceptados los cambios, por favor denle a "aprobar" para así poder hacer merge

vplentinax · 2020-06-24T16:05:02Z

/done

EzequielCaste

ok

javascript-translate-bot · 2020-06-24T18:06:43Z

Thank you 💖 I updated the Progress Issue #17 🎉 🎉 🎉

dev-balza added 6 commits June 17, 2020 22:50

Update article.md
7126286
First translation

Update article.md
1f65852
translation #2

Update article.md
2a5a563

Update article.md
c508fd8

Update article.md
6011db3

Update article.md
ba5404d

javascript-translate-bot added the review needed label Jun 19, 2020

javascript-translate-bot requested a review from a teamJune 19, 2020 22:09

vplentinax changed the title ~~Rama primera~~DOM treeJun 20, 2020

iliakan mentioned this pull request Jun 20, 2020
Spanish Translation Progress #17
Open

EzequielCaste self-requested a review June 20, 2020 12:34

javascript-translate-bot removed the review needed label Jun 20, 2020

javascript-translate-bot added the changes requested label Jun 20, 2020

cortizg reviewed Jun 20, 2020
View reviewed changes

Comment thread2-ui/1-document/02-dom-nodes/article.md Outdated

cortizg reviewed Jun 20, 2020
View reviewed changes

Comment thread2-ui/1-document/02-dom-nodes/article.md Outdated

cortizg reviewed Jun 20, 2020
View reviewed changes

Comment thread2-ui/1-document/02-dom-nodes/article.md Outdated

cortizg reviewed Jun 20, 2020
View reviewed changes

Comment thread2-ui/1-document/02-dom-nodes/article.md Outdated

EzequielCaste requested changes Jun 20, 2020
View reviewed changes

cortizg suggested changes Jun 20, 2020
View reviewed changes

Comment thread2-ui/1-document/02-dom-nodes/article.md Outdated

Update 2-ui/1-document/02-dom-nodes/article.md
da161e9
Co-authored-by: Carlos Ortiz Gutiérrez <56600925+cortizg@users.noreply.github.com>

EzequielCasteand others added 6 commits June 20, 2020 17:21

Update 2-ui/1-document/02-dom-nodes/article.md
633389e
Co-authored-by: Carlos Ortiz Gutiérrez <56600925+cortizg@users.noreply.github.com>

Update 2-ui/1-document/02-dom-nodes/article.md
782b04b
Co-authored-by: Carlos Ortiz Gutiérrez <56600925+cortizg@users.noreply.github.com>

Update 2-ui/1-document/02-dom-nodes/article.md
0ace07e
Co-authored-by: Carlos Ortiz Gutiérrez <56600925+cortizg@users.noreply.github.com>

Update 2-ui/1-document/02-dom-nodes/article.md
33ef7eb
Co-authored-by: Carlos Ortiz Gutiérrez <56600925+cortizg@users.noreply.github.com>

Update 2-ui/1-document/02-dom-nodes/article.md
38f9c7e
Co-authored-by: Carlos Ortiz Gutiérrez <56600925+cortizg@users.noreply.github.com>

Update 2-ui/1-document/02-dom-nodes/article.md
e3417cb

EzequielCaste requested changes Jun 20, 2020
View reviewed changes

dev-balza added 2 commits June 20, 2020 19:14

Update article.md
a5db7b4
/done

Update article.md
8b36f05
/done

Apply suggestions from code review
4d6cd78

EzequielCaste approved these changes Jun 24, 2020
View reviewed changes

javascript-translate-bot added needs +1 and removed changes requested labels Jun 24, 2020

EzequielCaste merged commit dc48bfc into javascript-tutorial:masterJun 24, 2020

EzequielCaste removed the needs +1 label Jun 24, 2020

	setTimeout(() => document.body.style.background = '', 3000); // devolución
	setTimeout(() => document.body.style.background = '', 3000); // volver atrás

	-`offsetWidth` -- anchura del nodo (en píxeles).
	-`offsetWidth` -- ancho del nodo (en píxeles).

	Comencemos con un documento sencillo, descrito a continuación:
	Comencemos con el siguiente documento simple:

	4. comentarios -- a veces podemos colocar ocasiones información allí, no se mostrará, pero JS puede leerla desde el DOM.
	4. comentarios -- a veces podemos colocar información allí, no se mostrará, pero JS puede leerla desde el DOM.

	Para ver la estructura del DOM en tiempo real, intente [visor en vivo del DOM](http://software.hixie.ch/utilities/js/live-dom-viewer/). Simplemente escriba el documento, y se mostrará como un DOM al instante.
	Para ver la estructura del DOM en tiempo real, intente [Live DOM Viewer](http://software.hixie.ch/utilities/js/live-dom-viewer/). Simplemente escriba el documento, y se mostrará como un DOM al instante.

	Puedes mirar el DOM, hacer clic sobre los elementos, ver sus detalles, etc.
	Puedes ver el DOM, hacer clic sobre los elementos, ver sus detalles, etc.

	Otra forma de realizarlo sería hacer clic derecho en la página web y en el menú contextual elegir la opción "inspeccionar".
	Otra forma de realizarlo sería hacer clic derecho en la página web y en el menú contextual elegir la opción "Inspeccionar Elemento".

	-Event Listeners -- nos ayuda a ver los escuchadores de eventos adjuntos a elementos del DOM (los cubriremos en la siguiente parte del tutorial).
	-Event Listeners -- nos ayuda a ver los listener de eventos adjuntos a elementos del DOM (los cubriremos en la siguiente parte del tutorial).

	<li>...and cunning animal!</li>
	<li>...y el astuto animal!</li>

Uh oh!

Conversation

dev-balza commented Jun 19, 2020

Uh oh!

CLAassistant commented Jun 19, 2020• edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

javascript-translate-bot commented Jun 20, 2020

Uh oh!

Uh oh!

Uh oh!

EzequielCaste commented Jun 20, 2020

Uh oh!

Uh oh!

EzequielCaste commented Jun 20, 2020

Uh oh!

Uh oh!

EzequielCaste left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

javascript-translate-bot commented Jun 20, 2020

Uh oh!

cortizg left a comment

Choose a reason for hiding this comment

Uh oh!

javascript-translate-bot commented Jun 20, 2020

Uh oh!

cortizg left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

javascript-translate-bot commented Jun 20, 2020

Uh oh!

cortizg left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

javascript-translate-bot commented Jun 20, 2020

Uh oh!

EzequielCaste left a comment

Choose a reason for hiding this comment

Uh oh!

javascript-translate-bot commented Jun 20, 2020

Uh oh!

cortizg commented Jun 20, 2020

Uh oh!

vplentinax commented Jun 24, 2020

Uh oh!

vplentinax commented Jun 24, 2020

Uh oh!

EzequielCaste left a comment

Choose a reason for hiding this comment

Uh oh!

javascript-translate-bot commented Jun 24, 2020

CLAassistant commented Jun 19, 2020•
edited
Loading