getElementsByName en IE7

Question

Tengo un código haciendo esto:

 var changes = document.getElementsByName(from);
 for (var c=0; c<changes.length; c++) {
   var ch = changes[c];
   var current = new String(ch.innerHTML);
   etc.
 }

Esto funciona bien en FF y Chrome, pero no en IE7. Presumiblemente porque getElementsByName no funciona en IE. ¿Cuál es la mejor solución?

Answer 1

En caso de que no sepa por qué esto no funciona en IE, aquí está la documentación de MSDN sobre esa función :

  

Cuando utiliza el método getElementsByName, se devuelven todos los elementos del documento que tienen el atributo NAME o el valor del atributo ID especificado.

     

Los elementos que admiten el atributo NAME y el atributo ID se incluyen en la colección devuelta por el método getElementsByName, pero los elementos con un expando NAME no se incluyen en la colección; por lo tanto, este método no se puede usar para recuperar etiquetas personalizadas por nombre.

Firefox permite getElementsByName () para recuperar elementos que usan un expando NAME, por eso funciona. Si eso es bueno o no, Good Thing ™ puede debatirse, pero esa es la realidad.

Entonces, una opción es usar el getAttribute () Método DOM para solicitar el atributo NAME y luego probar el valor para ver si es lo que desea y, de ser así, agregarlo a una matriz. Sin embargo, esto requeriría que iterara sobre todos los nodos de la página o al menos dentro de una subsección, lo que no sería lo más eficiente. Puede restringir esa lista de antemano utilizando algo como getElementsByTagName () quizás.

Otra forma de hacerlo, si tiene el control del HTML de la página, es dar a todos los elementos de interés un Id que varía solo por número, por ejemplo:

<div id="Change0">...</div>
<div id="Change1">...</div>
<div id="Change2">...</div>
<div id="Change3">...</div>

Y luego tener 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");

Eso es un truco, por supuesto, pero haría el trabajo que necesita y no sería demasiado ineficiente en comparación con otros trucos.

Si está utilizando un marco / kit de herramientas de JavaScript de algún tipo, sus opciones son mucho mejores, pero no tengo tiempo para entrar en esos detalles a menos que indique que está utilizando uno. Personalmente, no sé cómo viven las personas sin uno, ahorran tanto tiempo, esfuerzo y frustración que no puede permitirse no usar uno.

Answer 2

Hay un par de problemas:

1. IE es realmente confuso id = " " con name=""
2. name = " " no está permitido en <span>

Para solucionarlo, sugiero:

1. Cambie todos los name = " " a class=""
2. Cambie su código de esta manera:

-

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);

Answer 3

No es muy común encontrar elementos usando la propiedad NAME. Recomendaría cambiar a la propiedad ID.

Sin embargo, puede encontrar elementos con un nombre específico utilizando jQuery:

 $("*[name='whatevernameYouWant']");

esto devolverá todos los elementos con el nombre dado.

Answer 4

getElementsByName es compatible con IE, pero hay errores. En particular, devuelve elementos cuyo "id" coincide con el valor dado, así como el "nombre". Sin embargo, no puedo decir si ese es el problema que tienes sin un poco más de contexto, código y mensajes de error reales.

En general, getElementsByName probablemente se evite mejor, porque el atributo "nombre" en HTML tiene varios propósitos superpuestos que pueden confundir. Usar getElementById es mucho más confiable. Cuando trabaje específicamente con campos de formulario, puede usar de forma más confiable form.elements [name] para recuperar los campos que está buscando.

Answer 5

Solo otro error DOM en IE:

Error 1: http: // webbugtrack. blogspot.com/2007/08/bug-411-getelementsbyname-doesnt-work.html

Error 2: http: // webbugtrack. blogspot.com/2008/04/bug-403-another-getelementsbyname-bugs.html

Answer 6

He tenido éxito usando un contenedor para devolver una matriz de los elementos. Funciona en IE 6 y 7 también. Tenga en cuenta que no es 100% exactamente lo mismo que document.getElementsByName, ya que no es una NodeList. Pero para lo que lo necesito, que es simplemente ejecutar un bucle for en una matriz de elementos para hacer cosas simples como establecer .disabled = true, funciona lo suficientemente bien.

Aunque esta función todavía usa getElementsByName, funciona si se usa de esta manera. Véalo usted mismo.

function getElementsByNameWrapper(name) {
  a = new Array();

  for (var i = 0; i < document.getElementsByName(name).length; ++i) {
    a.push(document.getElementsByName(name)[i]);
  }

  return a;
}

Answer 7

Solución

                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]);
                    }
                }
            }