2010-08-24 20 views
5

Ho un elemento html che voglio nascondere dalla vista, ma non posso accedere a quell'elemento tramite un ID perché non ha ID e non posso assegnargli un ID. Ad esso è stata assegnata una classe. C'è un modo possibile per nascondere questo elemento dalla vista senza che sia id?Javascript: Nascondi gli elementi per nome della classe

+0

possibile duplicato di [Come getElementByClass invece di getElementById con javscript?] (Http://stackoverflow.com/questions/1933602/how-to-getelementbyclass-instead-of-getelementbyid-with-javscript) – recursive

risposta

5

Ci sono getElementsByClassName in alcuni browser, ma non è ampiamente supportato come getElementById. Si noti che produce una serie di elementi, anziché solo un singolo elemento, poiché diversi elementi possono avere la stessa classe.

Se è possibile assegnare un ID a un genitore si potrebbe essere in grado di accedervi in ​​qualche altro modo:

document.getElementById('parent').getElementsByTagName('div')[3] // or whatever 
+0

okay ... posso accedervi tramite un id genitore. Come potrei andare a nasconderlo dalla vista dopo che l'ho acceduto? – lewisqic

+0

non importa, l'ho capito ... var elements = document.getElementById ('home_poll'). GetElementsByTagName ('a'); \t \t elementi [2] .style.display = "nessuno"; – lewisqic

2

Il seguente file HTML contiene il codice per attivare o disattivare, nascondere, mostrare div per classe e id. Utilizzando la classe è possibile nascondere un set (gruppo) di divisioni.

<head> 

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
    <script type="text/javascript"> 
    /*function to toggle visibility of class*/ 
      function toggle_visibility(classname) { $("."+classname).toggle(); } 
    /*function to hide class*/ 
      function hide_visibility(classname) { $("."+classname).hide(); } 
    /*function to show class*/ 
      function show_visibility(classname) { $("."+classname).show(); } 
    /*function to hide individual div by id*/ 
      function hide_visibility(classname) { $("#"+classname).hide(); } 
    /*function to show individual div by id*/  
      function show_visibility(classname) { $("#"+classname).show(); } 
    </script> 

</head> 

<body> 

    <button onclick="toggle_visibility('class1');">Toggle visibility of class 1</button><br/> 
    <button onclick="hide_visibility('class1');">Hide class 1</button><br/> 
    <button onclick="show_visibility('class1');">Show class 1</button><br/> 
    <button onclick="show_visibility('heading1');">Show heading 1</button><br/> 
    <button onclick="hide_visibility('heading1');">Hide heading 1</button><br/> 

    <div class="class1" id="heading1"><h1>Heading 1</h1></div> 
    <div class="class1"><h2>Heading 2</h2></div> 
    <div class="class1"><h3>Heading 3</h3></div> 
    <div class="class1"><h4>Heading 4</h4></div> 
    <div class="class1"><h5>Heading 5</h5></div> 
    <div class="class1"><h6>Heading 6</h6></div> 

</body> 
Problemi correlati