¿Cómo se prueba la existencia de un elemento sin el uso del getElementById
método?
He configurado una demostración en vivo como referencia. También imprimiré el código aquí también:
<!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>
Básicamente, el código anterior demuestra que un elemento se almacena en una variable y luego se elimina del DOM. Aunque el elemento se ha eliminado del DOM, la variable conserva el elemento como estaba cuando se declaró por primera vez. En otras palabras, no es una referencia en vivo al elemento en sí, sino más bien una réplica. Como resultado, verificar la existencia del valor de la variable (el elemento) proporcionará un resultado inesperado.
La isNull
función es mi intento de verificar la existencia de elementos a partir de una variable, y funciona, pero me gustaría saber si hay una manera más fácil de lograr el mismo resultado.
PD: También me interesa saber por qué las variables de JavaScript se comportan así si alguien conoce algunos buenos artículos relacionados con el tema.