CodingForums.com - Hide class

CodingForums.com (http://www.codingforums.com/index.php)

- DOM and JSON scripting (http://www.codingforums.com/forumdisplay.php?f=15)

- - Hide class (http://www.codingforums.com/showthread.php?t=279879)

Vraith

10-28-2012 10:44 AM

Hide class

Hello :)

My assignment is to find all <p> and hide the ones that are <p class="show"> using a For Loop. "show" is supposed to be hidden when loading the page, because im gonna do a < a > that is gonna show them. This is what i have done, and it doesnt work. Did i do something wrong or am i way off here ?

windows.onload = prepareShow;
function prepareShow(){
var fan = document.getElementsByClassName("show");
for (var i = 0; i < fan.length; i++){
if (fan[i].getAttribute("class")=="show"){
fan[i].style.display="none";}
}
}

sunfighter

10-29-2012 12:47 AM

Can be done a few ways but :

Code:

<html>

<head>

<style type="text/css">

.show{

        display: none;

}

</style>

</head>

<body>

<p class="show">bill</p>

<p class="abit">See</p>

<p class="show">dick</p>

<p class="abit">Me</p>

<p class="show">jane</p>

<p class="abit">Run</p>

<button onclick="LetsSee()">Behold</button>



<script type="text/javascript">

function LetsSee()

{

        var x = document.getElementsByClassName("show").length;

        for(i = 0; i < x; i++ ){

        var fan = document.getElementsByClassName("show")[i].style.display = 'block';

        }

}

</script>

</body>

</html>

felgall

10-29-2012 02:16 AM

You can make the code a lot shorter than that:

Code:

function LetsSee()

{

        var x = document.getElementsByClassName("show");

        for(i = x.length-1; i >0 0; i-- ){

        x[i].style.display = 'block';

        }

}

rnd me

10-29-2012 06:46 AM

Quote:

Originally Posted by felgall (Post 1286426)

You can make the code a lot shorter than that:

Code:

function LetsSee()

{

        var x = document.getElementsByClassName("show");

        for(i = x.length-1; i >0 0; i-- ){

        x[i].style.display = 'block';

        }

}

You can make the code a lot shorter than that, (and re-usable):

Code:

function LetsSee(c,s,r){r=(r||document).getElementsByClassName(c);

 for(c in x)(x[c].style||0).display=s}

usage: LetsSee(classToHit , displayStyleToSet, opt_elmRoot );

ex (do what the previous codes do):

Code:

LetsSee("show","block");

felgall

10-29-2012 07:34 PM

Quote:

Originally Posted by rnd me (Post 1286452)

Code:

function LetsSee(c,s,r){r=(r||document).getElementsByClassName(c);

 for(c in x)(x[c].style||0).display=s}

Shouldn't that be

Code:

function LetsSee(c,s,r){x=(r||document).getElementsByClassName(c);

 for(c in x)(x[c].style||0).display=s}

All times are GMT +1. The time now is 07:41 PM.