Merge pull request #281 from Dorin-David/modifying-document

Modifying document

Author: longo-andrea

2-ui/1-document/07-modifying-document/1-createtextnode-vs-innerhtml/solution.md

@@ -1,8 +1,7 @@
-Answer: **1 and 3**.
+Risposta: **1 e 3**.
 
-Both commands result in adding the `text` "as text" into the `elem`.
-
-Here's an example:
+Entrambi i commandi risultano nell'aggiunta di `text` "come testo" dentro a `elem`.
+Ecco un esempio:
 
 ```html run height=80
 <div id="elem1"></div>

2-ui/1-document/07-modifying-document/1-createtextnode-vs-innerhtml/task.md

@@ -4,9 +4,9 @@ importance: 5
 
 # createTextNode vs innerHTML vs textContent
 
-We have an empty DOM element `elem` and a string `text`.
+Abbiamo `elem`, un elemento DOM vuoto, e una stringa`text`.
 
-Which of these 3 commands will do exactly the same?
+Quali di questi 3 comandi fanno esattamente la stessa cosa?
 
 1. `elem.append(document.createTextNode(text))`
 2. `elem.innerHTML = text`

2-ui/1-document/07-modifying-document/10-clock-setinterval/solution.md

@@ -52,6 +52,6 @@ function clockStop() {
 }
 ```
 
-Please note that the call to `update()` is not only scheduled in `clockStart()`, but immediately run in the line `(*)`. Otherwise the visitor would have to wait till the first execution of `setInterval`. And the clock would be empty till then.
+Nota che la chiamata a `update()` non è programmata solo in `clockStart()`, ma immediatamente dopo l'esecuzione della linea `(*)`. Altrimenti il visitatore dovrebbe aspettare fino alla prima esecuzione di `setInterval`. E l'orologio sarebbe vuoto fino ad allora. 
 
-Also it is important to set a new interval in `clockStart()` only when the clock is not running. Otherways clicking the start button several times would set multiple concurrent intervals. Even worse - we would only keep the `timerID` of the last interval, losing references to all others. Then we wouldn't be able to stop the clock ever again! Note that we need to clear the `timerID` when the clock is stopped in the line `(**)`, so that it can be started again by running `clockStart()`.
+E' altresì importante impostare il nuovo intervallo in `clockStart()` solo quando l'orologio non sta andando. Altrimenti cliccare il bottone start svariate volte imposterebbe multipli intervali concorrenti. Ancora peggio: terremmo solo il `timerID` dell'ultimo intervallo, perdendo la referenza a tutti gli altri. Così non potremmo più fermare l'orologio! Nota che dobbiamo rimuovere il `timerID` quando l'orologio viene fermato alla linea `(**)`, in modo da permettergi di ricominciare eseguendo `clockStart()`.

2-ui/1-document/07-modifying-document/10-clock-setinterval/solution.view/index.html

@@ -43,26 +43,26 @@
     }
 
     function clockStart() {
-      // set a new interval only if the clock is stopped
-      // otherwise we would rewrite the timerID reference to the running interval and wouldn't be able to stop the clock ever again
+      // imposta un nuovo intervallo solo se l'orologio è fermo
+      // altrimenti dovremmo riscrivere la referenza di timerID all'intervallo in esecuzione e non potremmo più fermare l'orologio
       if (!timerId) { 
         timerId = setInterval(update, 1000);
       }
-      update(); // <--  start right now, don't wait 1 second till the first setInterval works
+      update(); // <--  comincia subito, non aspettare un secondo affinché il primo setInterval funzioni
     }
 
     function clockStop() {
       clearInterval(timerId);
-      timerId = null; // <-- clear timerID to indicate that the clock has been stopped, so that it is possible to start it again in clockStart()
+      timerId = null; // <-- rimuovi timerID per indicare che l'orologio è stato fermato, in modo da poterlo far ripartire in clockStart()
     }
 
     clockStart();
   </script>
 
-  <!-- click on this button calls clockStart() -->
+  <!-- cliccare questo bottone chiama clockStart() -->
   <input type="button" onclick="clockStart()" value="Start">
 
-  <!-- click on this button calls clockStop() -->
+  <!-- cliccare questo bottone chiama clockStop() -->
   <input type="button" onclick="clockStop()" value="Stop">
 
 </body>

2-ui/1-document/07-modifying-document/10-clock-setinterval/source.view/index.html

@@ -2,10 +2,10 @@
 <html>
 <body>
 
-  <!-- click on this button calls clockStart() -->
+  <!-- cliccare questo bottone chiama clockStart() -->
   <input type="button" onclick="clockStart()" value="Start">
 
-  <!-- click on this button calls clockStop() -->
+  <!-- cliccare questo bottone chiama clockStop() -->
   <input type="button" onclick="clockStop()" value="Stop">
 
 </body>

2-ui/1-document/07-modifying-document/10-clock-setinterval/task.md

@@ -2,10 +2,10 @@ importance: 4
 
 ---
 
-# Colored clock with setInterval
+# Orologio colorato con setInterval
 
-Create a colored clock like here:
+Crea un orologio colorato come quello dell'esempio:
 
 [iframe src="solution" height=60]
 
-Use HTML/CSS for the styling, JavaScript only updates time in elements.
+Usa HTML/CSS per lo styling, JavaScript aggiorna solo il tempo negli elementi.

2-ui/1-document/07-modifying-document/11-append-to-list/solution.md

@@ -1,7 +1,7 @@
 
-When we need to insert a piece of HTML somewhere, `insertAdjacentHTML` is the best fit.
+Quando abbiamo bisogno di inserire dell'HTML da qualche parte, `insertAdjacentHTML` è la scelta migliore
 
-The solution:
+La soluzione:
 
 ```js
 one.insertAdjacentHTML('afterend', '<li>2</li><li>3</li>');

2-ui/1-document/07-modifying-document/11-append-to-list/task.md

@@ -2,9 +2,9 @@ importance: 5
 
 ---
 
-# Insert the HTML in the list
+# Inserisci l'HTML nella lista
 
-Write the code to insert `<li>2</li><li>3</li>` between two `<li>` here:
+Scrivi il codice per inserire `<li>2</li><li>3</li>` tra i due `<li>` sotto:
 
 ```html
 <ul id="ul">

2-ui/1-document/07-modifying-document/12-sort-table/solution.md

@@ -1,4 +1,4 @@
-The solution is short, yet may look a bit tricky, so here I provide it with extensive comments:
+La soluzione è breve, ma potrebbe sembrare difficile, quindi la commenteremo in dettaglio:
 
 ```js
 let sortedRows = Array.from(table.tBodies[0].rows) // 1
@@ -7,12 +7,12 @@ let sortedRows = Array.from(table.tBodies[0].rows) // 1
 table.tBodies[0].append(...sortedRows); // (3)
 ```
 
-The step-by-step algorthm:
+L'algoritmo passo per passo:
 
-1. Get all `<tr>`, from `<tbody>`.
-2. Then sort them comparing by the content of the first `<td>` (the name field).
-3. Now insert nodes in the right order by `.append(...sortedRows)`.
+1. Trova tutti i `<tr>` dentro `<tbody>`. 
+2. Ordinali comparando il contenuto del primo `<td>` (il campo con il nome).
+3. Ora inserisci i nodi nel giusto ordine con `.append(...sortedRows)`.
 
-We don't have to remove row elements, just "re-insert", they leave the old place automatically.
+Non dobbiamo rimuovere gli elementi della fila, solo "re-inserirli", lasciano automaticamente il vecchio posto.
 
-P.S. In our case, there's an explicit `<tbody>` in the table, but even if HTML table doesn't have `<tbody>`, the DOM structure always has it.
+P.S. Nel nostro caso c'è un esplicito `<tbody>` nella tabella; ma se anche non vi fosse, la struttura DOM lo include sempre e comunque. 

2-ui/1-document/07-modifying-document/12-sort-table/source.view/index.html

@@ -23,5 +23,5 @@
 </table>
 
 <script>
-  // ... your code ...
+  // ... il tuo codice ...
 </script>