Multiple name properties

Is this allowed? Is it correct?

[Dabrowski]

I have a page I'm doing, where I want to target certain <img> tags with some JS code.

Ideally I'd like to do <img name='iamhere' ....> but is it proper to have a few images with the same name?

I know it works, and I know that name is a valid property for <img>, but is it correct behaviour?

[encyclo]

Rather than

name

(which should only be used once per page), try using

class

and

document.getElementsByClassName("iamhere")

instead.

[penders]

Unfortunately

document.getElementsByClassName

is not a built-in JS function/method, but you can write your own...
[webmasterworld.com...]

[Dabrowski]

Thanks Penders, I have my own getElementsByClassName already, and incicentally getElementFromElement which will search within a particular element, but you can prevent it findint nested elements if you wish.

I have used the className method before, but find it's not as 'elegant'. But np, if name's can't be duplicated or aren't supposed to be that way will have to do.

[Robin_reala]

getElementsByClassName is in WHATWG's HTML5 spec and will make it into Firefox 3.0 as a native function (with the associated major speed increases)

[Dabrowski]

Good idea for HTML5, but as FF2 is still fairly new (I think as my own copy has only just updated itself from 1.5), I guess this is still a way off.

I wonder if MS will start using Windows Update to implement changes like this in IE7? Oh well, I guess time will tell.

Thanks for the info.

[Dabrowski]

Hmmmm, ok, consider this:

document.getElementById( "myDivWithID"); 
document.getElementsByName( "myImgsWithName"); 

If it's not allowed, why is the second function pleural?

I've done a bit of Googling on it, apparently you can't use name for DIVs, but certain things (img, a) it's still valid in HTML4/STRICT. in XHTML it's been deprecated in favour of id, which is definately only singular.

I have a script that's working fine in IE6, IE7 and FF that uses this method to find 4 IMGs.

Is there a spec sheet somewhere that defines it?

[Fotiman]

document.getElementsByName( "myImgsWithName");

If it's not allowed, why is the second function pleural?

The method above does not exist in the DOM Core [w3.org]. Are you maybe thinking of document.getElementsByTagName [w3.org]?

I've done a bit of Googling on it, apparently you can't use name for DIVs, but certain things (img, a) it's still valid in HTML4/STRICT. in XHTML it's been deprecated in favour of id, which is definately only singular.

I have a script that's working fine in IE6, IE7 and FF that uses this method to find 4 IMGs.

Is there a spec sheet somewhere that defines it?

The XHTML 1.0 spec. [w3.org] talks about this. Personally, I would avoid using multiple images with the same name, as the HTML 4.01 spec [w3.org] is not clear on what the behavior should be (though it does explicitly say that using id's is preferred and that name is only included for backward compatibility).

[edited by: Fotiman at 10:46 pm (utc) on April 23, 2007]

[Dabrowski]

The method above does not exist in the DOM Core. Are you maybe thinking of document.getElementsByTagName?

Nope. I'm definately using it, it definately works (IE6, 7, and FF), and it's definately not included in my own scripts anywhere.

I would avoid using multiple images with the same name, as the HTML 4.01 spec is not clear on what the behavior should be (though it does explicitly say that using id's is preferred and that name is only included for backward compatibility).

For now it appears to work on IMGs in the big 3, so I'll leave it at that. I'll have to change the code when I go up to XHTML though. It's a shame they've taken it out, it is very handy for targeting TAGs with JS. I know you can use ID but only for single elements.

Can you make up your own properties in XHTML by manipulating the schema? I've used, only once but very handy, a custom property on a tag. I did

myprop='thing'

in the HTML and it was accessibly in the DOM, cross browser.

I know it won't validate, but doesn't affect the page rendering, and what's the point in having an extensible DOM if you can't use it?

[Xapti]

Couldn't you give them different names (like with numbers tacked to the end), and get multiple results by using a wildcard or something for the target?

It would be too hard to test your question though... When it comes to validity (not sure if you're looking for validity, or just functional operation), you can just do a validation on a simple page you can make.

For operation, you'll probably just test it on a couple (or however many you want) browsers, and hope the best for the rest...

[Fotiman]

Since a name is similar to an id (in that it somewhat identifies an item), it doesn't really make much sense to have more than one image sharing the same name. In your particular case, I would use a class instead, since a class suggests that the object is a certain type of thing. Then I'd use one of the available getElementsByClassName methods available (I personally prefer to use the Yahoo UI Library's DOM Utility for this sort of thing).

[penders]

document.getElementsByName()

DOM Level 2 HTML: (?)
[w3.org...]

...in XHTML it's [name] been deprecated in favour of id...

Is that 'deprecated', or perhaps recommended? It's certainly been deprecated on 'certain' elements.

"In [XHTML 1.0] documents, this methods only return the (possibly empty) collection of form controls with matching name." (Cite) [w3.org]

Using the same name attribute for certain form controls is perfectly acceptable/necessary, is it not? This is the only time I use the name attrib - form elements.

[Dabrowski]

http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-71555259

Thanks for that link Penders, as the function returns an array, it would seem that duplicates are allowed on certain elements that actually allow the use of the name property. In HTML at least. I don't think name properties are supported at all in XHTML/STRICT.

[Fotiman]

Thanks for the link penders. I generally only refer to the DOM Core instead of the HTML/XHTML DOM, which is why I didn't see getElementsByName.

...in XHTML it's [name] been deprecated in favour of id...

Is that 'deprecated', or perhaps recommended? It's certainly been deprecated on 'certain' elements.

Section 4.10 of the XHTML spec [w3.org] states:

HTML 4 defined the name attribute for the elements a, applet, form, frame, iframe, img, and map.
<snip>
Note that in XHTML 1.0, the name attribute of these elements is formally deprecated, and will be removed in a subsequent version of XHTML.

So it has been deprecated for those elements in which it makes sense to use id instead.

Using the same name attribute for certain form controls is perfectly acceptable/necessary, is it not? This is the only time I use the name attrib - form elements.

Yes, it's still perfectly valid to use the name attribute on form controls.

[Dabrowski]

It seems we've deviated from the point slightly. I was already aware of the name property being on in HTML, but not XHTML, the question was are multiple names the same acceptable.

As the function returns an array, I'm guessing it is, although I can't find anything official on this.

[Fotiman]

As the function returns an array, I'm guessing it is, although I can't find anything official on this.

Actually, it returns a NodeList, not an array. But close enough. :) I would say that this is official. Yes, you can (in HTML) have certain elements sharing the same name.

Personally, I would still steer clear of it. Given the fact that this behavior does NOT exist in XHTML, that tells me that it has been determined to be not the best way to do it. Are you breaking anything if you do (in HTML)? No. But like I said... they deprecated it for a reason.