Existem três maneiras comuns de obter elementos, a saber, a saber, nome, nome por meio do elemento, nome através de tag e nome através da classe.
getElementById
O DOM fornece um método chamado getElementById, que retornará um objeto de nó com o atributo de ID correspondente. Por favor, tenha cuidado para ser sensível ao caso ao usá -lo.
É uma função exclusiva do objeto do documento e só pode ser chamado através dele. Os métodos utilizados são os seguintes:
A cópia do código é a seguinte:
document.getElementById ('Demo') // Demo é o ID correspondente ao elemento
Este método é compatível com os principais navegadores, incluindo o IE6+, e pode ser usado com ousadia.
getElementsByTagName
Este método retorna uma matriz de objetos (para ser precisa, coleta htmlcollection, não é uma matriz verdadeira), cada objeto corresponde a um elemento com uma determinada tag no documento. Semelhante ao getElementById, esse método fornece apenas um parâmetro e seu parâmetro é o nome da tag especificada. O código de exemplo é o seguinte:
A cópia do código é a seguinte:
document.getElementsByTagName ('li') // li é o nome da tag
Deve -se notar que, além de ser chamado por objetos de documentos, esse método também pode ser chamado por elementos comuns. Exemplos são os seguintes:
A cópia do código é a seguinte:
var demo = document.getElementById ('Demo');
var lis = Demo.getElementsByTagName ('Li');
Da mesma forma, esse método é compatível com os principais navegadores, incluindo o IE6+, e pode ser usado com ousadia.
getElementsbyclassName
Além de obter elementos especificando tags, o DOM também fornece o método getElementsByClassName para obter o elemento com o nome da classe especificado. No entanto, como esse método é relativamente novo, os navegadores mais antigos não o suportam, como o IE6. No entanto, podemos compensar as deficiências de navegadores antigos através do hack. O método é chamado da seguinte maneira:
A cópia do código é a seguinte:
document.getElementsByclassName ('Demo') // O nome da classe especificado pela demonstração é
Como o getElementsByTagName, esse método pode ser chamado por elementos comuns, além de ser chamado pelos objetos do documento.
Para navegadores mais antigos, como IE6 e 7, podemos implementá -los através do seguinte hack:
A cópia do código é a seguinte:
function getElementsbyclassName (nó, classe) {
if (node.getElementsByClassName) {
Return Node.getElementsByClassName (ClassName);
}outro {
var resulta = [];
var elems = node.getElementsByTagName ("*");
for (var i = 0; i <elems.length; i ++) {
if (elems [i] .className.indexOf (className)! = -1) {
Resultados [Results.Length] = elems [i];
}
}
RETORNO DE RECURSOS;
}
}
expandir
Se você não estiver satisfeito apenas com os métodos de seleção de elementos acima, deseja obter elementos através de seletores como o JQuery. O método de implementação é semelhante ao getElementsbyClassName acima. Se você estiver interessado, pode implementar um conjunto de seletores. No entanto, acho que os três métodos acima combinados com bolhas de eventos são suficientes, afinal, essas três performances são excelentes.
O exposto acima é tudo sobre este artigo, espero que seja útil para todos.