getElementsByName no IE7
-
07-07-2019 - |
Pergunta
Eu tenho algum código fazer isso:
var changes = document.getElementsByName(from);
for (var c=0; c<changes.length; c++) {
var ch = changes[c];
var current = new String(ch.innerHTML);
etc.
}
Esta multa funciona no FF e Chrome, mas não no IE7. Presumivelmente porque getElementsByName não está funcionando no IE. Qual é a melhor solução?
Solução
No caso de você não sei por que isso não está funcionando no IE, aqui é a documentação MSDN nessa função :
Quando você usa o método getElementsByName, todos os elementos no documento que têm o valor do atributo NAME ou atributo ID especificada são retornados.
Os elementos que suporte tanto o atributo de nome eo atributo ID são incluídos na coleção retornada pelo método getElementsByName, mas elementos com um nome expando não estão incluídos na coleção; Portanto, este método não pode ser usado para recuperar tags personalizadas pelo nome.
O Firefox permite getElementsByName()
para recuperar elementos que usar um expando nome, que é por isso que funciona. Quer ou não isso é uma boa coisa ™ pode ser motivo de debate, mas essa é a realidade.
Assim, uma opção é usar o getAttribute()
método DOM para pedir o atributo de nome e, em seguida, testar o valor para ver se é o que você quer, e se assim for, adicioná-lo para uma matriz. Isso exigiria, no entanto, que você iterar sobre todos os nós na página ou, pelo menos, dentro de uma subseção, o que não seria o mais eficiente. Você poderia restringir essa lista de antemão usando algo como getElementsByTagName()
talvez.
Outra maneira de fazer isso, se você está no controle do HTML da página, é dar todos os elementos de interesse um ID que varia apenas por número, por exemplo:.
<div id="Change0">...</div>
<div id="Change1">...</div>
<div id="Change2">...</div>
<div id="Change3">...</div>
E, em seguida, ter o JavaScript como este:
// assumes consecutive numbering, starting at 0
function getElementsByModifiedId(baseIdentifier) {
var allWantedElements = [];
var idMod = 0;
while(document.getElementById(baseIdentifier + idMod)) { // will stop when it can't find any more
allWantedElements.push(document.getElementById(baseIdentifier + idMod++));
}
return allWantedElements;
}
// call it like so:
var changes = getElementsByModifiedId("Change");
Isso é um truque, é claro, mas isso iria fazer o trabalho que você precisa e não ser muito ineficiente comparar com alguns outros hacks.
Se você estiver usando um JavaScript framework / kit de ferramentas de algum tipo, você opções são muito melhor, mas eu não tenho tempo para entrar nesses detalhes a menos que você indicar que você está usando um. Pessoalmente, eu não sei como as pessoas vivem sem um, eles economizar tempo tanto, esforço e frustração que você não pode pagar não para usar um.
Outras dicas
Há um par de problemas:
- IE é realmente confuso
id=""
comname=""
-
name=""
não é permitido em<span>
Para corrigir, eu sugiro:
- Alterar todo o
name=""
paraclass=""
- Alterar o seu código como este:
-
var changes = document.getElementById('text').getElementsByTagName('span');
for (var c=0; c<changes.length; c++) {
var ch = changes[c];
if (ch.className != from)
continue;
var current = new String(ch.innerHTML);
Não é muito comum encontrar elementos usando a propriedade Name. Eu recomendaria a mudança para a propriedade ID.
No entanto, pode encontrar elementos com um nome específico usando jQuery:
$("*[name='whatevernameYouWant']");
isso irá retornar todos os elementos com o nome fornecido.
getElementsByName é suportado no IE, mas existem bugs. Em particular ele retorna elementos cuja ‘id’ corresponder ao valor determinado, bem como ‘nome’. não posso dizer se esse é o problema que você está tendo sem um pouco mais contexto, código e mensagens de erro reais embora.
Em geral, getElementsByName é provavelmente melhor evitar, porque o atributo ‘nome’ em HTML tem várias finalidades sobrepostas que podem confundir. Usando getElementById é muito mais confiável. Quando especificamente trabalhar com os campos do formulário, você pode usar de forma mais confiável form.elements [nome] para recuperar os campos que você está procurando.
Apenas um outro bug DOM no IE:
Erro 1: http: // webbugtrack. blogspot.com/2007/08/bug-411-getelementsbyname-doesnt-work.html
Bug 2: http: // webbugtrack. blogspot.com/2008/04/bug-403-another-getelementsbyname-bugs.html
Eu tive sucesso usando um wrapper para retornar uma matriz de elementos. Funciona no IE 6 e 7 também. Tenha em mente que não é 100% é a exata mesma coisa que document.getElementsByName, já que não é um NodeList. Mas para o que eu preciso dele para, que é apenas para executar um loop em um conjunto de elementos para fazer coisas simples como o ajuste .disabled = true, ele funciona bem o suficiente.
Mesmo que esta função ainda usa getElementsByName, ele funciona se utilizado dessa forma. Veja por si mesmo.
function getElementsByNameWrapper(name) {
a = new Array();
for (var i = 0; i < document.getElementsByName(name).length; ++i) {
a.push(document.getElementsByName(name)[i]);
}
return a;
}
Solução
var listOfElements = document.getElementsByName('aName'); // Replace aName with the name you're looking for
// IE hack, because it doesn't properly support getElementsByName
if (listOfElements.length == 0) { // If IE, which hasn't returned any elements
var listOfElements = [];
var spanList = document.getElementsByTagName('*'); // If all the elements are the same type of tag, enter it here (e.g.: SPAN)
for(var i = 0; i < spanList.length; i++) {
if(spanList[i].getAttribute('name') == 'aName') {
listOfElements.push(spanList[i]);
}
}
}