Merge pull request #253 from pasor1/article/03-dom-navigation

longo-andrea · web-flow · commit b29198cee2f8 · 2021-03-14T15:21:00.000+01:00
Walking the DOM
diff --git a/2-ui/1-document/03-dom-navigation/1-dom-children/solution.md b/2-ui/1-document/03-dom-navigation/1-dom-children/solution.md
@@ -1,27 +1,27 @@
-There are many ways, for instance:
+E' possibile farlo in diversi modi, ad esempio:
 
 
-The `<div>` DOM node:
+Il nodo DOM `<div>`:
 
 ```js
 document.body.firstElementChild
-// or
+// oppure
 document.body.children[0]
-// or (the first node is space, so we take 2nd)
+// oppure (il primo nodo è uno spazio, quindi prendiamo il secondo)
 document.body.childNodes[1]
 ```
 
-The `<ul>` DOM node:
+Il nodo DOM `<ul>`:
 
 ```js
 document.body.lastElementChild
-// or
+// oppure
 document.body.children[1]
 ```
 
-The second `<li>` (with Pete):
+Il secondo `<li>` (con Pete):
 
 ```js
-// get <ul>, and then get its last element child
+// prendi <ul>, e quindi il suo ultimo elemento figlio
 document.body.lastElementChild.lastElementChild
 ```
diff --git a/2-ui/1-document/03-dom-navigation/1-dom-children/task.md b/2-ui/1-document/03-dom-navigation/1-dom-children/task.md
@@ -2,14 +2,14 @@ importance: 5
 
 ---
 
-# DOM children
+# Figli nel DOM
 
-Look at this page:
+Guardiamo questa pagina:
 
 ```html
 <html>
 <body>
-  <div>Users:</div>
+  <div>Utenti:</div>
   <ul>
     <li>John</li>
     <li>Pete</li>
@@ -18,7 +18,7 @@ Look at this page:
 </html>
 ```
 
-For each of the following, give at least one way of how to access them:
-- The `<div>` DOM node?
-- The `<ul>` DOM node?
-- The second `<li>` (with Pete)?
+Per ciascuno dei seguenti, fornire almeno un modo per accedervi:
+- Il nodo DOM `<div>` ?
+- Il nodo DOM `<ul>` ?
+- Il secondo `<li>` (con Pete)?
diff --git a/2-ui/1-document/03-dom-navigation/3-navigation-links-which-null/solution.md b/2-ui/1-document/03-dom-navigation/3-navigation-links-which-null/solution.md
@@ -1,6 +1,6 @@
-1. Yes, true. The element `elem.lastChild` is always the last one, it has no `nextSibling`.
-2. No, wrong, because `elem.children[0]` is the first child *among elements*. But there may exist non-element nodes before it. So `previousSibling` may be a text node.
+1. Si, è vero. L'elemento `elem.lastChild` è sempre l'ultimo, non ha `nextSibling`.
+2. No, è falso, perché `elem.children[0]` è il primo figlio tra i nodi di tipo *elemento*, ma potrebbero esserci nodi di tipo diverso. Ad esempio `previousSibling` potrebbe essere un nodo di testo.
 
-Please note: for both cases if there are no children, then there will be an error.
+Nota: in entrambi i casi, se non ci sono figli si verificherà un errore.
 
-If there are no children, `elem.lastChild` is `null`, so we can't access `elem.lastChild.nextSibling`. And the collection `elem.children` is empty (like an empty array `[]`).
+Se non ci sono figli, `elem.lastChild` è `null`, quindi non possiamo accedere a `elem.lastChild.nextSibling`. E la collection `elem.children` sarà vuota (come un array vuoto `[]`).
diff --git a/2-ui/1-document/03-dom-navigation/3-navigation-links-which-null/task.md b/2-ui/1-document/03-dom-navigation/3-navigation-links-which-null/task.md
@@ -2,9 +2,9 @@ importance: 5
 
 ---
 
-# The sibling question
+# La questione dei fratelli
 
-If `elem` -- is an arbitrary DOM element node...
+Se `elem` è un nodo arbitrario del DOM...
 
-- Is it true that `elem.lastChild.nextSibling` is always `null`?
-- Is it true that `elem.children[0].previousSibling` is always `null` ?
+- E' vero che `elem.lastChild.nextSibling` è sempre `null`?
+- E' vero che `elem.children[0].previousSibling` è sempre `null`?
diff --git a/2-ui/1-document/03-dom-navigation/4-select-diagonal-cells/solution.md b/2-ui/1-document/03-dom-navigation/4-select-diagonal-cells/solution.md
@@ -1 +1 @@
-We'll be using `rows` and `cells` properties to access diagonal table cells.
+Useremo le proprietà `rows` e `cells` per accedere alle celle sulla diagonale della tabella.
diff --git a/2-ui/1-document/03-dom-navigation/4-select-diagonal-cells/source.view/index.html b/2-ui/1-document/03-dom-navigation/4-select-diagonal-cells/source.view/index.html
@@ -54,7 +54,7 @@
   <script>
     let table = document.body.firstElementChild;
 
-    // your code
+    // il tuo codice
   </script>
 </body>
 </html>
diff --git a/2-ui/1-document/03-dom-navigation/4-select-diagonal-cells/task.md b/2-ui/1-document/03-dom-navigation/4-select-diagonal-cells/task.md
@@ -2,17 +2,17 @@ importance: 5
 
 ---
 
-# Select all diagonal cells
+# Seleziona tutte le celle sulla diagonale
 
-Write the code to paint all diagonal table cells in red.
+Scrivi il codice per evidenziare in rosso tutte celle sulla diagonale  della tabella.
 
-You'll need to get all diagonal `<td>` from the `<table>` and paint them using the code:
+Dovrai estrarre tutte i `<td>` in diagonale da `<table>` ed evidenziarli usando il codice:
 
 ```js
-// td should be the reference to the table cell
+// td dovrebbe essere il riferimento alla cella della tabella
 td.style.backgroundColor = 'red';
 ```
 
-The result should be:
+Il risultato dovrebbe essere:
 
 [iframe src="solution" height=180]
diff --git a/2-ui/1-document/03-dom-navigation/article.md b/2-ui/1-document/03-dom-navigation/article.md

Original file line number	Diff line number	Diff line change
`@@ -1 +1 @@`
`1`		-We'll be using `rows` and `cells` properties to access diagonal table cells.
	`1`	+Useremo le proprietà `rows` e `cells` per accedere alle celle sulla diagonale della tabella.