Was macht diese JavaScript-Zeile eigentlich?

Question

Jungs, ich bin neu in Javascript und ich verstehe alles in diesem Code durch Forschung, aber ich verstehe nicht, was die Zeilen [9] und [12] tatsächlich tun, um den Code. Meine Vermutung ist, dass es ID "msg" nennt, wenn die Taste gedrückt wird, aber was macht das dann? Alle Hilfe wird geschätzt.

Answer 1

Finden Sie die <element id="msg"></element>, und was auch immer darin ist, löschen Sie es und ersetzen Sie es durch was auch immer in der Variablen products ist, und analysieren Sie alle HTML, die wir darin finden.

Answer 2

Es findet ein Element mit der ID "msg" und legt seinen Wert auf Produkte fest, was eine Referenz auf ein Array ist.

Grundsätzlich Dokument bedeutet this.

getElementById ist eine Funktion zum Suchen eines Elements in HTML.

Sie können innerHTML als Inhalt/Wert des Elements verstehen.

Answer 3

<p>Click the button to sort the array.</p> 

// create a new button 
// when a user clicks this button, call the RearrangeArray function 
<button onclick="RearrangeArray()">Rearrange Array</button> 

// create a new paragraph element and set its id to "msg" 
// by doing so, you can get a reference to this element and modify the contents 
// or attributes using javascript 
<p id="msg"></p> 


<script> 

// define an array containing the following strings 
var products = ["Printer", "Tablet", "Router", "Computer","TV"]; 

// get the paragraph element defined earlier, then set its innerHTML 
// property to the products 

// because products is not a string, it is coerced to a string by 
// joining each of the elements with a comma 
document.getElementById("msg").innerHTML = products; 


// defines a function that is available globally 
// the button above refers to this function in the 'onclick' handler 
function RearrangeArray() { 

    // sorts the array of products above using the javascript array sort function 
    // the products should now look like this: ["Computer", "Printer", "Router", "TV", "Tablet"] 
    products.sort(); 

    // get the element with the id of "msg" (which you defined above) 
    // and set its html to the now-sorted array of products (coerced as a string) 
    document.getElementById("msg").innerHTML = products; 
} 

</script> 

Answer 4

All HTML-Tag ein id Attribut und in einer Web-Seite haben kann, sollte es eindeutig sein, ist dies eine der Möglichkeiten, wie Sie ein DOM-Objekt von HTML-Tag in einer Variablen the document.getElementById("ID_value") Verwendung speichern können. Außerdem speichert die Eigenschaft innerHTML eines DOM-Objekts den HTML-Code innerhalb des richtigen Tags dieses Objekts.

So dieser Zeile:

document.getElementById("msg").innerHTML = products; 

bedeutet, dass die Werte der Produkte als Array der Ebene HTML innerhalb des Tags zu speichern, die die msg ID.