¿Cómo deshabilitar los bloques div que tienen un determinado patrón de identificación?

Question

Me gustaría escribir un script greasemonkey para deshabilitar un div en una página determinada. En cualquier carga de la página, no sé dónde estará el div en el DOM, pero sé que siempre se llama <div id = "alertPanel"> ....</div>

¿Qué debo hacer para deshabilitar este div?

Mis pensamientos intial eran algo a lo largo de las líneas de:

var myDivs= document.getElementsByTagName('div'); 

for (i=0; i<myDivs.length; i++) 
{ 

    if (myDivs[i].<get id property somehow> = "alertPanel") 
    myDivs[i].style.visibility = 'hidden'; 
} 

pero como se puede decir que estoy atascado en el acceso a la propiedad de identificación de una comprobación de igualdad.

Dicho sea de paso, estoy usando un editor de texto para escribir esto - me adivinar que una norma editor de javascript daría una lista de terminación automática después de escribir myDivs[i].

Answer 1

Si tiene una id, puede utilizar document.getElementById:

var div = document.getElementById("alertPanel"); 

Entonces, si existe, puede eliminarlo (probablemente sea una mala idea) u ocultarlo:

if (div) { 
    div.style.display = "none"; // Hides it 
    // Or 
    // div.parentNode.removeChild(div); // Removes it entirely 
} 

actualización: Re su comentario en otra respuesta:

gracias por su respuesta. ¿Su estado se aplica a una página con iframes también? El div en cuestión está en un iframe. He intentado con la solución ypur y no funcionó por desgracia. tal vez un enlace a la página le ayudará a: tennis.betfair.com el div quiero desactivar es el que tiene id: minigamesContainer

Si el elemento está en un iframe, entonces usted tiene que llamar a getElementById en el documento eso está en el iframe, ya que iframe s son ventanas separadas y tienen documentos separados. Si conoce la id del iframe, puede utilizar document.getElementById para obtener la instancia iframe, y luego usar contentDocument para acceder a su documento y, a continuación, utilizar getElementById en que para obtener el elemento "minigamesContainer":

var iframe, div; 
iframe = document.getElementById("the_iframe_id"); 
if (iframe) { 
    try { 
     div = iframe.contentDocument.getElementById("minigamesContainer"); 
     if (div) { 
      div.style.display = "none"; 
     } 
    } 
    catch (e) { 
    } 
} 

(El try/catch está ahí debido a un posible error de seguridad al acceder al contenido del iframe; no conozco a Greasemonkey lo suficiente como para saber si se aplica el SOP. Tiendo a suponer que no es así, pero es mejor que esté seguro .. .)

Si no conoce el id del iframe o si no tiene uno, usted puede simplemente bucle a través de todos ellos para que hagan con document.getElementsByTagName y luego bucle:

var iframes, index, iframe, div; 
iframes = document.getElementsByTagName("iframe"); 
for (index = 0; index < iframes.length; ++index) { 
    iframe = iframes[index]; 
    try { 
     div = iframe.contentDocument.getElementById("minigamesContainer"); 
     if (div) { 
      div.style.display = "none"; 
      break; 
     } 
    } 
    catch (e) { 
    } 
} 

Referencias :

• DOM2 Core
• DOM2 HTML
• DOM3 Core
• HTML5 Web Applications APIs

Answer 2

En HTML válido que puede tener cierta único elemento con ID. Por lo tanto:

document.getElementById('alertPanel').style.visiblity = 'hidden'; 

Pero si usted todavía tiene que recorrer todos los divs y comprobar sus identificaciones, entonces esto debería funcionar:

if (myDivs[i].id == "alertPanel") myDivs[i].style.visibility = 'hidden';