Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    dep
    dep is offline
    Regular Coder
    Join Date
    Nov 2005
    Posts
    121
    Thanks
    0
    Thanked 0 Times in 0 Posts

    How many elements on the page have the same ID?

    How can I find out how many elements on the page have the same ID?

    dep

  • #2
    jkd
    jkd is offline
    Senior Coder jkd's Avatar
    Join Date
    May 2002
    Location
    metro DC
    Posts
    3,163
    Thanks
    1
    Thanked 18 Times in 18 Posts
    Technically, only at most 1 element may have a particular id. If two or more elements share the same id, then it is a violation of the DTD specification for the id attribute (IDREF).

    A better way to group items is either by the class attribute or by the name attribute. If you use the name attribute, then document.getElementsByName("thename").length returns the number of elements with that name.

    If you don't mind invalid markup and IE-only, then you can keep the id's and use document.all["theid"].length to determine the number of elements with the same id.

  • #3
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    Maybe it does not fit exactly to this thread but...

    Sometimes it may happen that you need to group some elements but you can not use id (as id must be unique) nore name (for different reasons, you need them to have different names) nor classNames (for different reasons you need them to have different classes) nor tagname (they might have different tag names).

    This case there might be another tricky way to group those such different elements, by using a "faux attribute" (make sure it is not a HTML or Javascript reserved word).
    PHP Code:
    function findGrouped(fauxAtt){
    var 
    el document.getElementsByTagName('*');//here's a wild card
    for(var i=0;i<el.length;i++){
    if(
    el[i].getAttribute(fauxAtt)!=null){
    ... do 
    something ...
    }
    }

    for instance:
    PHP Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"  "http://www.w3.org/TR/html4/loose.dtd">
    <
    html>
    <
    head>
    <
    title>Untitled Document</title>
    <
    meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <
    meta http-equiv="Content-Style-Type" content="text/css">
    <
    meta http-equiv="Content-Script-Type" content="text/javascript">
    <
    script type="text/javascript">
    onload = function(){
    findGrouped('foo');
    }
    function 
    findGrouped(fauxAtt){
    var 
    el document.getElementsByTagName('*');
    for(var 
    i=0;i<el.length;i++){
    if(
    el[i].getAttribute(fauxAtt)!=null){
    alert(el[i].innerHTML)
    }
    }
    }
    </script>
    </head>
    <body>
    <span>one</span>
    <span>two</span>
    <div foo>has foo Attribute</div>
    <span>three</span>
    <span foo>has also a foo Attribute</span>
    <span>four</span>
    </body>
    </html> 
    It might be used for instance when validate different required elements in a form, which must have different names (or ids), have different classes and have different tag names (input, textarea...)
    Last edited by Kor; 01-11-2006 at 10:52 AM.
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •