Wie testet man ein Element auf seine Existenz ohne die Verwendung der getElementById Methode?
Ich habe eine Live-Demo als Referenz. Ich werde den Code auch hier ausdrucken:
<!DOCTYPE html>
<html>
<head>
<script>
var getRandomID = function (size) {
var str = "",
i = 0,
chars = "0123456789abcdefghijklmnopqurstuvwxyzABCDEFGHIJKLMNOPQURSTUVWXYZ";
while (i < size) {
str += chars.substr(Math.floor(Math.random() * 62), 1);
i++;
}
return str;
},
isNull = function (element) {
var randomID = getRandomID(12),
savedID = (element.id)? element.id : null;
element.id = randomID;
var foundElm = document.getElementById(randomID);
element.removeAttribute('id');
if (savedID !== null) {
element.id = savedID;
}
return (foundElm) ? false : true;
};
window.onload = function () {
var image = document.getElementById("demo");
console.log('undefined', (typeof image === 'undefined') ? true : false); // false
console.log('null', (image === null) ? true : false); // false
console.log('find-by-id', isNull(image)); // false
image.parentNode.removeChild(image);
console.log('undefined', (typeof image === 'undefined') ? true : false); // false ~ should be true?
console.log('null', (image === null) ? true : false); // false ~ should be true?
console.log('find-by-id', isNull(image)); // true ~ correct but there must be a better way than this?
};
</script>
</head>
<body>
<div id="demo"></div>
</body>
</html>Der obige Code zeigt, wie ein Element in einer Variablen gespeichert und dann aus dem DOM entfernt wird. Auch wenn das Element aus dem DOM entfernt wurde, behält die Variable das Element so bei, wie es bei der ersten Deklaration war. Mit anderen Worten, es handelt sich nicht um einen Live-Verweis auf das Element selbst, sondern um eine Kopie. Daher wird die Überprüfung des Variablenwerts (des Elements) auf Existenz ein unerwartetes Ergebnis liefern.
El isNull Funktion ist mein Versuch, das Vorhandensein eines Elements aus einer Variablen zu überprüfen, und es funktioniert, aber ich würde gerne wissen, ob es einen einfacheren Weg gibt, um das gleiche Ergebnis zu erzielen.
PS: Ich bin auch daran interessiert, warum JavaScript-Variablen verhalten sich so, wenn jemand weiß, einige gute Artikel zu diesem Thema.
28 Stimmen
Eigentlich ist es ein aktiver Verweis auf das Element selbst, es befindet sich nur nicht mehr in einem Dokument. Diese Funktionalität ist erforderlich, weil Sie tatsächlich ein Element aus dem DOM herausziehen und es später wieder einfügen können, wobei alle Ereignishandler usw. immer noch mit ihm verbunden sind. Und warum verhalten sich JS-Variablen so? Weil es unglaublich ärgerlich wäre, wenn sie es nicht täten. JS löscht Variablen nur, wenn Sie nicht mehr JEDEN Verweis auf sie haben. Die Sprache hat keine Möglichkeit zu wissen, welche Verweise Sie für wichtig halten und welche Sie für wertlos halten.
0 Stimmen
@cwolves Interessant. Ich bin schon oft darauf gestoßen und habe mir nie viel dabei gedacht. In meinem aktuellen Projekt speichere ich Elemente in einem Array, bevor ich sie ändere, nur für den Fall, dass ich die Änderungen rückgängig machen möchte.
1 Stimmen
Die Garbage Collection läuft von Zeit zu Zeit und löscht alles, was sie für möglich hält. Sie scheint in den meisten Browsern ziemlich lausig zu sein, wird aber immer besser, da die Entwickler erkennen, dass einige Browser tagelang oder wochenlang zwischen zwei Neustarts laufen, so dass eine gute Garbage Collection für die Leistung des Browsers entscheidend ist. Webentwickler können dazu beitragen, indem sie Eigenschaften (und damit Verweise auf Dinge im Speicher) löschen, die nicht mehr benötigt werden.
2 Stimmen
@JustinBull seien Sie vorsichtig mit dem Speichern von Kopien der Elemente, die Sie umkehren wollen. Wenn ein DOM-Element in einem Array gespeichert wird, wird ein Verweis auf das DOM-Element gespeichert, nicht eine Kopie, so dass Änderungen am DOM-Element reflektiert werden, wenn auf das Array-Element verwiesen wird. Dies ist der Fall mit allen Objekten in Javascript (Variablen vom Typ 'Objekt').