GV

GeezerVison

The World Wide Web, restored to 800 pixels of glory.

Home|About|Gaming cabinet|Archives|How it works|Starter sites

On this site

  • Sign in
  • ActionsCI/CD and automation
  • CodespacesCloud development environments
  • All Features
  • Documentation
  • Training
  • Certifications
  • Build with Copilot
  • Customize Copilot
  • Integrations
  • Trending repos
  • GitHub Sponsors
  • Developer articles
  • Enterprises

This view

  • Original page
  • New address

GeezerVison is showing github.com — DOM tree by dev-balza · Pull Request #264 · javascript-tutorial/es.javascript.info

Conversation

@dev-balza

@dev-balza dev-balza commented Jun 19, 2020

Copy link
Copy Markdown
Contributor

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

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

All reactions
dev-balza added 6 commits June 17, 2020 22:50
@dev-balza
Update article.md
7126286
First translation
@dev-balza
Update article.md
1f65852
translation #2
@dev-balza
Update article.md
2a5a563
@dev-balza
Update article.md
c508fd8
@dev-balza
Update article.md
6011db3
@dev-balza
Update article.md
ba5404d
@javascript-translate-bot javascript-translate-bot added the review needed label Jun 19, 2020
@javascript-translate-bot
javascript-translate-bot requested a review from a team June 19, 2020 22:09
@CLAassistant

CLAassistant commented Jun 19, 2020 •
edited
Loading

Uh oh!

There was an error while loading. Please reload this page.

Copy link
Copy Markdown

CLA assistant check
All committers have signed the CLA.

All reactions

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

@vplentinax vplentinax changed the title Rama primera DOM tree Jun 20, 2020
@iliakan iliakan mentioned this pull request Jun 20, 2020
Spanish Translation Progress #17
Open
@EzequielCaste
EzequielCaste self-requested a review June 20, 2020 12:34
@javascript-translate-bot javascript-translate-bot removed the review needed label Jun 20, 2020
@javascript-translate-bot

javascript-translate-bot commented Jun 20, 2020

Copy link
Copy Markdown

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

All reactions

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

@javascript-translate-bot javascript-translate-bot added the changes requested label Jun 20, 2020
cortizg
cortizg reviewed Jun 20, 2020
View reviewed changes
Comment thread 2-ui/1-document/02-dom-nodes/article.md Resolved

Uh oh!

There was an error while loading. Please reload this page.

cortizg
cortizg reviewed Jun 20, 2020
View reviewed changes
Comment thread 2-ui/1-document/02-dom-nodes/article.md Resolved

Uh oh!

There was an error while loading. Please reload this page.

@EzequielCaste

EzequielCaste commented Jun 20, 2020

Copy link
Copy Markdown
Contributor

@cortizg estoy revisando...

All reactions

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

cortizg
cortizg reviewed Jun 20, 2020
View reviewed changes
Comment thread 2-ui/1-document/02-dom-nodes/article.md Resolved

Uh oh!

There was an error while loading. Please reload this page.

@EzequielCaste

EzequielCaste commented Jun 20, 2020

Copy link
Copy Markdown
Contributor

digo para no hacer 2 revisiones a la vez

All reactions

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

cortizg
cortizg reviewed Jun 20, 2020
View reviewed changes
Comment thread 2-ui/1-document/02-dom-nodes/article.md Resolved

Uh oh!

There was an error while loading. Please reload this page.

EzequielCaste
EzequielCaste requested changes Jun 20, 2020
View reviewed changes

@EzequielCaste EzequielCaste left a comment

Copy link
Copy Markdown
Contributor

There was a problem hiding this comment.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

algunos cambios

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

All reactions
Comment thread 2-ui/1-document/02-dom-nodes/article.md Outdated
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

@EzequielCaste EzequielCaste Jun 20, 2020

Copy link
Copy Markdown
Contributor

There was a problem hiding this comment.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

All reactions
Comment thread 2-ui/1-document/02-dom-nodes/article.md Outdated
- `offsetWidth` -- the node width (in pixels)
- ...and so on.
- `innerHTML` -- contenido HTML del nodo.
- `offsetWidth` -- anchura del nodo (en píxeles).

@EzequielCaste EzequielCaste Jun 20, 2020

Copy link
Copy Markdown
Contributor

There was a problem hiding this comment.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

All reactions
Comment thread 2-ui/1-document/02-dom-nodes/article.md Outdated
## Un ejemplo del DOM

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

@EzequielCaste EzequielCaste Jun 20, 2020

Copy link
Copy Markdown
Contributor

There was a problem hiding this comment.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

All reactions
Comment thread 2-ui/1-document/02-dom-nodes/article.md Outdated
Comencemos con un documento sencillo, descrito a continuación:

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

@EzequielCaste EzequielCaste Jun 20, 2020

Copy link
Copy Markdown
Contributor

There was a problem hiding this comment.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
```ejecución html sin formatear
```html run no-beautify

éste código no se debe traducir, es código interno

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

All reactions
Comment thread 2-ui/1-document/02-dom-nodes/article.md Outdated

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

@EzequielCaste EzequielCaste Jun 20, 2020

Copy link
Copy Markdown
Contributor

There was a problem hiding this comment.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
```conectado
```online

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

All reactions
Comment thread 2-ui/1-document/02-dom-nodes/article.md Outdated
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.

@EzequielCaste EzequielCaste Jun 20, 2020

Copy link
Copy Markdown
Contributor

There was a problem hiding this comment.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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.

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

All reactions
Comment thread 2-ui/1-document/02-dom-nodes/article.md Outdated
## 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.

@EzequielCaste EzequielCaste Jun 20, 2020

Copy link
Copy Markdown
Contributor

There was a problem hiding this comment.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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.

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

All reactions
Comment thread 2-ui/1-document/02-dom-nodes/article.md Outdated
![](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.

@EzequielCaste EzequielCaste Jun 20, 2020

Copy link
Copy Markdown
Contributor

There was a problem hiding this comment.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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.

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

All reactions
Comment thread 2-ui/1-document/02-dom-nodes/article.md Outdated
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".

@EzequielCaste EzequielCaste Jun 20, 2020

Copy link
Copy Markdown
Contributor

There was a problem hiding this comment.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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".

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

All reactions

@EzequielCaste EzequielCaste Jun 20, 2020

Copy link
Copy Markdown
Contributor

There was a problem hiding this comment.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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"

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

All reactions
Comment thread 2-ui/1-document/02-dom-nodes/article.md Outdated
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).

@EzequielCaste EzequielCaste Jun 20, 2020

Copy link
Copy Markdown
Contributor

There was a problem hiding this comment.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

All reactions
@javascript-translate-bot

javascript-translate-bot commented Jun 20, 2020

Copy link
Copy Markdown

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

All reactions

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

cortizg
cortizg suggested changes Jun 20, 2020
View reviewed changes

@cortizg cortizg left a comment

Copy link
Copy Markdown
Contributor

There was a problem hiding this comment.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

hay comentario y cambios necesarios

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

All reactions
@javascript-translate-bot

javascript-translate-bot commented Jun 20, 2020

Copy link
Copy Markdown

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

All reactions

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

cortizg
cortizg suggested changes Jun 20, 2020
View reviewed changes

@cortizg cortizg left a comment

Copy link
Copy Markdown
Contributor

There was a problem hiding this comment.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

otras observaciones

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

All reactions
Comment thread 2-ui/1-document/02-dom-nodes/article.md Resolved

Uh oh!

There was an error while loading. Please reload this page.

Comment thread 2-ui/1-document/02-dom-nodes/article.md Resolved

Uh oh!

There was an error while loading. Please reload this page.

Comment thread 2-ui/1-document/02-dom-nodes/article.md Resolved

Uh oh!

There was an error while loading. Please reload this page.

Comment thread 2-ui/1-document/02-dom-nodes/article.md Outdated
<!-- comment -->
<!-- comentario -->
*/!*
<li>...and cunning animal!</li>

@cortizg cortizg Jun 20, 2020

Copy link
Copy Markdown
Contributor

There was a problem hiding this comment.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

All reactions
@javascript-translate-bot

javascript-translate-bot commented Jun 20, 2020

Copy link
Copy Markdown

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

All reactions

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

cortizg
cortizg suggested changes Jun 20, 2020
View reviewed changes

@cortizg cortizg left a comment

Copy link
Copy Markdown
Contributor

There was a problem hiding this comment.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

mejor como review

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

All reactions
Comment thread 2-ui/1-document/02-dom-nodes/article.md Resolved

Uh oh!

There was an error while loading. Please reload this page.

@javascript-translate-bot

javascript-translate-bot commented Jun 20, 2020

Copy link
Copy Markdown

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

All reactions

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

@EzequielCaste @cortizg
Update 2-ui/1-document/02-dom-nodes/article.md
da161e9
Co-authored-by: Carlos Ortiz Gutiérrez <[email protected]>
EzequielCaste and others added 6 commits June 20, 2020 17:21
@EzequielCaste @cortizg
Update 2-ui/1-document/02-dom-nodes/article.md
633389e
Co-authored-by: Carlos Ortiz Gutiérrez <[email protected]>
@EzequielCaste @cortizg
Update 2-ui/1-document/02-dom-nodes/article.md
782b04b
Co-authored-by: Carlos Ortiz Gutiérrez <[email protected]>
@EzequielCaste @cortizg
Update 2-ui/1-document/02-dom-nodes/article.md
0ace07e
Co-authored-by: Carlos Ortiz Gutiérrez <[email protected]>
@EzequielCaste @cortizg
Update 2-ui/1-document/02-dom-nodes/article.md
33ef7eb
Co-authored-by: Carlos Ortiz Gutiérrez <[email protected]>
@EzequielCaste @cortizg
Update 2-ui/1-document/02-dom-nodes/article.md
38f9c7e
Co-authored-by: Carlos Ortiz Gutiérrez <[email protected]>
@EzequielCaste
Update 2-ui/1-document/02-dom-nodes/article.md
e3417cb
EzequielCaste
EzequielCaste requested changes Jun 20, 2020
View reviewed changes

@EzequielCaste EzequielCaste left a comment

Copy link
Copy Markdown
Contributor

There was a problem hiding this comment.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

necesito una segunda opinión

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

All reactions
@javascript-translate-bot

javascript-translate-bot commented Jun 20, 2020

Copy link
Copy Markdown

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

All reactions

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

dev-balza added 2 commits June 20, 2020 19:14
@dev-balza
Update article.md
a5db7b4
/done
@dev-balza
Update article.md
8b36f05
/done
@cortizg

cortizg commented Jun 20, 2020

Copy link
Copy Markdown
Contributor

/done

All reactions

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

@vplentinax

vplentinax commented Jun 24, 2020

Copy link
Copy Markdown
Contributor

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

All reactions

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

@vplentinax

vplentinax commented Jun 24, 2020

Copy link
Copy Markdown
Contributor

/done

All reactions

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

@EzequielCaste
Apply suggestions from code review
4d6cd78
EzequielCaste
EzequielCaste approved these changes Jun 24, 2020
View reviewed changes

@EzequielCaste EzequielCaste left a comment

Copy link
Copy Markdown
Contributor

There was a problem hiding this comment.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ok

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

All reactions
@javascript-translate-bot javascript-translate-bot added needs +1 and removed changes requested labels Jun 24, 2020
@EzequielCaste
EzequielCaste merged commit dc48bfc into javascript-tutorial:master Jun 24, 2020
@javascript-translate-bot

javascript-translate-bot commented Jun 24, 2020

Copy link
Copy Markdown

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

All reactions

Sorry, something went wrong.

Uh oh!

There was an error while loading. Please reload this page.

@EzequielCaste EzequielCaste removed the needs +1 label Jun 24, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@EzequielCaste EzequielCaste EzequielCaste approved these changes
+1 more reviewer
@cortizg cortizg cortizg requested changes
Reviewers whose approvals may not affect merge requirements

Uh oh!

There was an error while loading. Please reload this page.

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

Uh oh!

There was an error while loading. Please reload this page.

6 participants

@dev-balza @CLAassistant @javascript-translate-bot @EzequielCaste @cortizg @vplentinax
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
You are visitor 01402503 — GeezerVison does not store the pages you look up.
Best viewed with Netscape Navigator 4.7 or Internet Explorer 6 at 800×600. No cookies required.