...">
Clever Geek Handbook

About getElementById find multiple ids name?

I have an id tag

<div id="view_1"></div>
<div id="view_2"></div>
<div id="view_3"></div>

I am using getElementsByClassName how can it work

but "class" I take it to delimit the css style

How can document.getElementById find -> "view_1" "view_2" "view_3" 

    function hideDIV(){

        var divs = document.getElementById('view'.*);
        for(var i=0; i<divs.length; i++) { 
          divs[i].style.display='none';
        }
    }

enter image description here

+3


source to share


5 answers


You can do it:

var divs = document.getElementsByTagName("div");
for(var i = 0; i < divs.length; i++) {
    if(divs[i].id.indexOf('view_') == 0) {
        divs[i].style.display='none';
    }
}


DEMO

+4


source


Use QuerySelectorAll for this:

document.querySelectorAll('[id^="view_"]').id;


This will allow all views starting with view_

See: Database javascript getElementById for partial string

+1


source


Try this: Fiddle

JS:

$('[id*="view"]').hide();

Html:

<div id="view_1"> dcf</div>
<div id="view_2"> DSg</div>
<div id="view_3"> gsde</div>
0


source


No, it won't work.

document.getElementById () method only takes one argument.

However, you can always set classes on elements and use instead getElementsByClassName()

. Another option for modern browsers is to use the method querySelectorAll()

:

use $("div[id*='view']")

DEMO: http://jsfiddle.net/mkufymqr/1/

0


source


Vanilla JavaScript

document.querySelectorAll('div[id^="view_"]');

jQuery

$('div[id^="view_"]');

CSS 3

div[id^="view_"] { ... }

But consider using classes, rather than identifiers, for semantically targeted elements.

For example: find all DIVs with class targetDiv

and add class to them hidden

. Then define the class hidden

as display: none

in CSS.

0


source






More articles:


All Articles