Ist innerHTML aufdringliches JavaScript?

Question

jeder. Ich lerne jetzt JavaScript in der Schule. Unser Lehrer schlägt vor, dass wir kein aufdringliches JavaScript verwenden. Also ich frage mich, ob das innereHTML aufdringlich ist oder nicht, vielen Dank!

Answer 1

Keine Eigenschaft ist an sich Teil von aufdringlichem oder unaufdringlichem JavaScript.

Ob ein Stück JavaScript nicht unauffällig ist oder nicht, hängt davon ab, wie es sich verhalten soll when the JS fails.

Dies ist aufdringlich. Wenn das JS nicht funktioniert, passiert nichts.

<button type="button"> 
    Show the answer 
</button> 
<script> 
    document.querySelector("button").addEventListener("click", show); 
    function show() { document.body.innerHTML = "The answer"; } 
</script> 

Dies ist unaufdringlich. Wenn das JS nicht funktioniert, wird die Funktionalität des JS durch ein serverseitiges Fallback ersetzt.

<a href="the-answer.html"> 
    Show the answer 
</a> 
<script> 
    document.querySelector("a").addEventListener("click", show); 
    function show(e) { 
     e.preventDefault(); 
     document.body.innerHTML = "The answer"; 
    } 
</script> 

Dies ist unauffällig (sofern die Funktionalität nicht kritisch ist). Wenn das JS nicht funktioniert, wird der Button überhaupt nicht angezeigt (es gibt also keinen kaputten Button).

<script> 
    var button = document.createElement("button"); 
    button.type = "button"; 
    document.body.appendChild(button); 
    button.addEventListener("click", show); 
    function show() { 
     document.body.innerHTML = "The answer"; 
    } 
</script> 

Answer 2

Ich denke, Ihr Lehrer möchte, dass Sie unter anderem Javascript vermeiden.

Wie aus dem Wikipedia-Beispiel für die Einrichtung eines Klick-Handlers ersichtlich, anstelle einer Inline-Onclick-Funktion.

https://en.wikipedia.org/wiki/Unobtrusive_JavaScript#Separation_of_behavior_from_markup

Answer 3

Es hängt davon ab, wie Sie es verwenden.

Wenn zum Beispiel, sind Sie innerHTML mit dem Innenleben eines anderen Elements zu ändern, nachdem der Benutzer einen Link wie diesen im Rahmen einer Anfrage AJAX klickt:

<a href="#" id="link1" onclick="document.getElementById('element').innerHTML=['page.html' contents]">View Page</a>

... als ja, du benutzt es aufdringlich. Wenn Sie waren so etwas wie dies zu tun:

<a href="page.html" id="link1" class="ajax-link">View Page</a>

und man hatte eine externe JavaScript-Datei, die den Code behandelt, die innerHTML eines anderen Elements modifiziert, als Sie es unaufdringlich verwenden.

Das erste Beispiel ist aufdringlich, weil der Link den Inhalt von 'page.html' für Benutzer mit aktiviertem JavaScript anzeigt, aber nicht für diejenigen ohne.

Das zweite Beispiel ist unauffällig da, mit oder ohne JavaScript, werden die Nutzer den Inhalt von ‚seite.html‘ zu sehen sein

mehr unten:

Es läuft darauf hinaus, dieses: Ihre Website und ihr Inhalt sollten immer noch zugänglich sein, wenn JavaScript nicht verfügbar ist - der einzige Weg, dies zu gewährleisten, ist die Verwendung von unaufdringlichen JavaScript-Techniken.

Quelle: http://blog.teamtreehouse.com/unobtrusive-javascript-important