Hay tres formas comunes de obtener elementos, a saber, a saber, a saber, el nombre a través de la identificación del elemento, el nombre a través de la etiqueta y el nombre a través de la clase.
GetElementByid
DOM proporciona un método llamado GetElementById, que devolverá un objeto de nodo con el atributo de identificación correspondiente. Tenga cuidado de ser sensible al caso cuando lo use.
Es una función exclusiva del objeto de documento y solo se puede llamar a través de él. Los métodos utilizados son los siguientes:
La copia del código es la siguiente:
document.getElementById ('demo') // demo es la identificación correspondiente al elemento
Este método es compatible con los navegadores convencionales, incluso que incluye IE6+, y puede usarse audazmente.
GetElementsByTagName
Este método devuelve una matriz de objetos (para ser precisos, colección htmlCollection, no es una matriz verdadera), cada objeto corresponde a un elemento con una etiqueta dada en el documento. Similar a GetElementByID, este método solo proporciona un parámetro, y su parámetro es el nombre de la etiqueta especificada. El código de ejemplo es el siguiente:
La copia del código es la siguiente:
document.getElementsBytagName ('li') // li es el nombre de la etiqueta
Cabe señalar que, además de ser llamado por objetos de documento, este método también puede ser llamado por elementos ordinarios. Los ejemplos son los siguientes:
La copia del código es la siguiente:
var demo = document.getElementById ('demo');
var lis = demo.getElementsBytagName ('li');
Del mismo modo, este método es compatible con los navegadores convencionales, incluso incluyendo IE6+, y puede usarse con valentía.
GetElementsByClassName
Además de obtener elementos especificando etiquetas, el DOM también proporciona el método GetElementsByClassName para obtener el elemento con el nombre de clase especificado. Sin embargo, debido a que este método es relativamente nuevo, los navegadores más antiguos no lo admiten, como IE6. Sin embargo, podemos compensar las deficiencias de los viejos navegadores a través de Hack. El método se llama como sigue:
La copia del código es la siguiente:
document.getElementsByClassName ('demo') // El nombre de clase especificado por la demostración es
Al igual que GetElementsByTagName, este método puede ser llamado por elementos ordinarios además de ser llamado por objetos de documento.
Para los navegadores más antiguos, como IE6 y 7, podemos implementarlos a través del siguiente hack:
La copia del código es la siguiente:
función getElementsByClassName (node, classname) {
if (node.getElementsByClassName) {
return node.getElementsByClassName (className);
}demás {
resultados var = [];
var elems = node.getElementsByTagName ("*");
para (var i = 0; i <elems.length; i ++) {
if (elems [i] .classname.indexof (classname)! = -1) {
Resultados [resultado.length] = Elems [i];
}
}
resultados de devolución;
}
}
expandir
Si no solo está satisfecho con los métodos de selección de elementos anteriores, desea obtener elementos a través de selectores como jQuery. El método de implementación es similar al GetElementsByClassName anterior. Si está interesado, puede implementar un conjunto de selectores. Sin embargo, creo que los tres métodos anteriores combinados con burbujas de eventos son suficientes, después de todo, estas tres actuaciones son excelentes.
Lo anterior se trata de este artículo, espero que sea útil para todos.