Analyse und Lösung des a.getAttribute(href,2)-Problems in IE6/7
|
Kurzbeschreibung <br />In IE6 und 7 wird in einem allgemeinen a-Tag (einem in HTML geschriebenen und über DOM-Operationen in die Seite eingefügten a-Tag) der ursprüngliche Wert von href nicht direkt über a.getAttribute("href") abgerufen, wenn der Wert von href ein relativer Pfad ist. Der ursprüngliche Wert kann jedoch über a.getAttribute("href",2) abgerufen werden. Wenn dieser a-Tag jedoch über innerHTML eingefügt wird, kann der ursprüngliche href-Wert auch über a.getAttribute("href",2) nicht abgerufen werden. Es wird geschätzt, dass IE6 und 7 bei innerHTML='<a href="/haha">test</a>' eine Kompatibilitätsverarbeitung dafür durchführen und einige Dinge hinzufügen werden. Zu diesem Zeitpunkt ist das href von a bei der Anzeige durch outerHTML bereits die vollständige Adresse -_-! Es wird gesagt, dass eine ähnliche Situation im src von img auftreten wird. Code kopieren Der Code lautet wie folgt:<!doctype html> <html lang="de"> <Kopf> <meta charset="UTF-8"> <title>Prüfung</title> </Kopf> <Text> <a id="a" href="" onclick=".getAttribute(\"href\",2)">Test</a> </body> </html> Wenn Sie in IE6 oder 7 darauf klicken, wird ein großes „/haha“ angezeigt! ! ! Ich begann zu vermuten, dass da noch etwas anderes im Gange war. Zu diesem Zeitpunkt habe ich darüber nachgedacht, woher mein a-Tag stammt (stringbasierte JS-Vorlage, innerHTML) … Also habe ich es mit dem folgenden Code simuliert: Code kopieren Der Code lautet wie folgt:<!doctype html> <html lang="de"> <Kopf> <meta charset="UTF-8"> <title>Prüfung</title> </Kopf> <Text> <div id="test"></div> <Skript> document.getElementById("test").innerHTML = '<a id="a" href="/haha" onclick="alert(this.getAttribute(\'href\',2));return false;">test</a>'; </Skript> </body> </html> Nochmals getestet ... bei meiner Schwester ... das Problem ist wieder aufgetreten! Beim tatsächlichen Testen kann nach dem Generieren von a erneut setAttribute("href","/haha",2) und anschließend getAttribute("href",2) "/haha" zurückerhalten. Aber wenn Sie so etwas in einer Vorlage machen möchten, erscheint es Ihnen zu ekelhaft, also geben Sie entschieden auf! Es ist besser, auf Franks Rat zu hören ... Fügen Sie einfach ein Attribut hinzu, um die beiden Linkelemente zu identifizieren, und bleiben Sie nicht in der Routine stecken. Nochmal bohren-_-!: Code kopieren Der Code lautet wie folgt:<!doctype html> <html lang="de"> <Kopf> <meta charset="UTF-8"> <title>Prüfung</title> </Kopf> <Text> <div id="test"></div> <Skript> var test = document.getElementById("test"); var a = document.createElement("a"); var txt = document.createTextNode("test"); ein.href="/haha"; a.onclick=Funktion() { Alarm (dies.getAttribute ('href',2));//"/haha" gibt false zurück; }; a.appendChild(txt); test.appendChild(a); </Skript> </body> </html> Schließlich vermute ich, dass IE6 und 7 beim Einfügen von Knoten über innerHTML eine Art „Fehlertoleranz“-Verarbeitung durchführen, die sie für richtig halten … und dann lag ich falsch … |
<<: Schritte für IDEA zur Integration von Docker zur Realisierung einer Remote-Bereitstellung
>>: Eine kurze Analyse der Unterschiede zwischen Undo, Redo und Binlog in MySQL
Artikel empfehlen
Verwenden Sie HTML+Css, um eine einfache Navigationsleistenfunktion zu implementieren (die Navigationsleiste ändert die Hintergrundfarbe, wenn die Maus darauf stößt).
Ⅰ. Problembeschreibung: Verwenden Sie HTML+CSS, u...
Zusammenfassung neuer Anwendungsbeispiele für Calculated in Vue3
Die Verwendung von „Computed“ in vue3. Da vue3 mi...
CSS-Methode zur Steuerung der Elementhöhe von unten nach oben und von oben nach unten
Beginnen wir die Diskussion mit einer häufig gest...
Ein Artikel, der Ihnen hilft, jQuery-Animationen zu verstehen
Inhaltsverzeichnis 1. Steuern Sie die Anzeige und...
Einigen Eigenschaften in CSS geht ein "*" oder "_" voraus.
Einigen Eigenschaften in CSS geht ein "*&quo...
Zusammenfassung der genauen Berechnungen verschiedener Abstände/Scrolldistanzen in einem Fenster
Normalerweise müssen wir uns bei der Projektentwic...
Vue implementiert einfache Rechnerfunktion
In diesem Artikelbeispiel wird der spezifische Co...
So verwenden Sie Volume zum Übertragen von Dateien zwischen Host und Docker-Container
Ich habe zuvor einen Artikel über die Dateiübertr...
MySQL-Anmeldefehler beheben: „Zugriff für Benutzer ‚root‘@‚localhost‘ verweigert“
Erstens weiß ich nicht, warum ich mich über die B...
Detaillierte Erklärung des Problems bei der Kombination von CSS-Ellipsen und -Auffüllungen
Textkürzung mit CSS Beachten Sie den folgenden Co...
HTML-Tabellen-Markup-Tutorial (43): VALIGN-Attribut der Tabellenüberschrift
In vertikaler Richtung können Sie die Ausrichtung...
MySQL-Datenbank-Grundlagen SQL-Fensterfunktion Beispielanalyse-Tutorial
Inhaltsverzeichnis Einführung Einführung Aggregat...
Zusammenfassung der Unterschiede zwischen den MySQL-Speicher-Engines MyISAM und InnoDB
1. Änderungen in der Standard-Speicher-Engine von...
Soll die Like-Funktion MySQL oder Redis verwenden?
Inhaltsverzeichnis 1. Häufige Fehler von Anfänger...
Detaillierte Erläuterung der zugrunde liegenden Implementierungsmethode des Nginx-Polling-Algorithmus
Einführung in den Polling-Algorithmus Viele Leute...