Can I use same div ID on different pages

Get Started
1

I’ve designed a block of <div></div> to use with javascript and jQuery. I would use this div block on several pages. I found it’s hassled to given new id to every one of them and code identical javascript/jQuery for them all.

Can I use the same id and javascript codes for every page?

Thanks

2

Yes, indeed you should. Just remember that you can only use an id once per page. But you can use it on as many pages as you like.

3

Actually, some time ago for a test sake I tried to use the same ID in DIV’s in a page. It worked. But I cannot be sure it will work on other browsers and other computers, too. So, to be safe just use distinct ID’s. I made a large hierarchic system of ID’s and CLASSes for our Portfolio section:

4

[font=verdana]It depends what you mean by “it worked”. If you have, let’s say, two lots of <div id=“section1”>…</div>
then this will probably work:

#section1 {border:1px grey solid;}

but it’s very unlikely that either of these two will reliably work:

var editsection = document.getElementById('section1')

<a href="#section1">Jump to section 1</a>

As the original question was about using the ID as a hook for Javascript, you need to be careful about what you’ve tested multiple IDs for (and yes, I know you did put a disclaimer about it not being guaranteed to work on different browsers and computers).[/font]

5

You could also consider to use a class

6

JavaScript hooks only work with ids and not with classes.

7

These days they work with both, don’t they?

8

My knowledge of JavaScript is limited but I distinctly remember that classes could not be hooked when using sliding drawers.

The KLUDGE was to use PHP to create an array of IDs such as #slider1, #slider2, #slider3, etc

9

For ids you use getElementById() which returns a single element from the page

For classes you use getElementsByClassName() which returns a list of elements from the page which you then need to process with a loop.