Useful JS Function

azcn2503 · Mon Nov 07, 2005 1:01 pm

Just thought I'd let you in on the MASTER FUNCTION! I include it all the time whenever I'm making any sort of DOM manipulation script. Put the following code in the head:

[code:1:eff19224a8]<script type="text/javascript"></script>[/code:1:eff19224a8]

Just use it in the following way:

If you wanted to change the width of the table with an id attribute of "table1", do the following:
[code:1:eff19224a8]grab("table1").style.width="600px";[/code:1:eff19224a8]

Or if you wanted to change the visibility of a certain element with an id attribute of "div3", do the following:
[code:1:eff19224a8]grab("div3").style.visibility="hidden";[/code:1:eff19224a8]

Handy bit of code.

azcn2503 · Mon Nov 07, 2005 1:14 pm

The above code works in all browsers.

Also, if you want to grab elements using the tag name, you can use the following code:

[code:1:e40b7c4b54]<script type="text/javascript"></script>[/code:1:e40b7c4b54]

This always returns an array, so even if there is only one of something, such as the body tag, you'll need to manipulate it like so...

[code:1:e40b7c4b54]document.getElementsByTagName("body")[0].style.backgroundColor='#000';[/code:1:e40b7c4b54]

Yay!

Skillers · Mon Nov 07, 2005 3:54 pm

I have no idea what that does! Could you enlighten me?

The 2nd and 3rd bits of code just seem like HTMl rewritten in javascript to me.

Black Flash · Mon Nov 07, 2005 4:59 pm

yeah, cud u put it on some webpage, let us see when and why we wud use it, cos since its comin from u its probably good

azcn2503 · Mon Nov 07, 2005 11:37 pm

Copy and paste the following code to make a page where the text is manipulated slightly.

[code:1:dc830a8928]<head>

<script type="text/javascript"></script>

</head>

<body>

<div style="width:100px;text-align:justify;" id="hello">

This is some placeholder text. I am here to make this page look pretty. I do nothing, basically. By clicking the button below, you will see
the effect of this super duper function, which is cross browser functional! Excellent, not much more to say...

</div>

<input type="button" value="+++" onclick="grab('hello').style.width='200px';" />
<input type="button" value="---" onclick="grab('hello').style.width='100px';" />

</body>[/code:1:dc830a8928]

Skillers · Tue Nov 08, 2005 7:51 am

Ahhhh, I see. It allow the user to change the width of the table by pressing a button. Very useful.

azcn2503 · Tue Nov 08, 2005 9:27 am

It's very handy. Works with almost everything in the document. Good for dynamically changing the class of something (CSS), like when you want to turn tab_default in to tab_active.

Useful JS Function

Who is online