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.
Page 1 of 2 12 LastLast
Results 1 to 15 of 18
  1. #1
    Master Coder
    Join Date
    Feb 2003
    Location
    UmeŚ, Sweden
    Posts
    5,575
    Thanks
    0
    Thanked 83 Times in 74 Posts

    getElementsByAttribute

    Could be rewritten to work in ie5w, ie5m, of course, but I like it like it is:
    Code:
    // document.getElementsByAttribute([string attributeName],[string attributeValue],[boolean isCommaHyphenOrSpaceSeparatedList:false])
    document.getElementsByAttribute=function(attrN,attrV,multi){
        attrV=attrV.replace(/\|/g,'\\|').replace(/\[/g,'\\[').replace(/\(/g,'\\(').replace(/\+/g,'\\+').replace(/\./g,'\\.').replace(/\*/g,'\\*').replace(/\?/g,'\\?').replace(/\//g,'\\/');
        var
            multi=typeof multi!='undefined'?
                multi:
                false,
            cIterate=document.getElementsByTagName('*'),
            aResponse=[],
            attr,
            re=new RegExp(multi?'\\b'+attrV+'\\b':'^'+attrV+'$'),
            i=0,
            elm;
        while((elm=cIterate.item(i++))){
            attr=elm.getAttributeNode(attrN);
            if(attr &&
                attr.specified &&
                re.test(attr.value)
            )
                aResponse.push(elm);
        }
        return aResponse;
    }
    Last edited by liorean; 11-16-2005 at 06:37 PM.
    liorean <[lio@wg]>
    Articles: RegEx evolt wsabstract , Named Arguments
    Useful Threads: JavaScript Docs & Refs, FAQ - HTML & CSS Docs, FAQ - XML Doc & Refs
    Moz: JavaScript DOM Interfaces MSDN: JScript DHTML KDE: KJS KHTML Opera: Standards

  • #2
    Master Coder
    Join Date
    Feb 2003
    Location
    UmeŚ, Sweden
    Posts
    5,575
    Thanks
    0
    Thanked 83 Times in 74 Posts
    OK, an ie5 compatible version. (untested)
    Code:
    // document.getElementsByAttribute([string attributeName],[string attributeValue],[boolean isCommaSeparatedList:false])
    document.getElemen&#0116;sByAttribute=function(attrN,attrV,multi){
        attrV=attrV.replace(/\|/g,'\\|').replace(/\[/g,'\\[').replace(/\(/g,'\\(').replace(/\+/g,'\\+').replace(/\./g,'\\.').replace(/\*/g,'\\*').replace(/\?/g,'\\?').replace(/\//g,'\\/');
        var
            multi=typeof multi!='undefined'?
                multi:
                false,
            cIterate=typeof document.all!='undefined'?
                document.all:
                document.getElementsByTagName('*'),
            aResponse=[],
            re=new RegExp(multi?
                '\\b'+attrV+'\\b':
                '^'+attrV+'$'),
            i=0,
            elm;
        while((elm=cIterate.item(i++))){
            if(re.test(elm.getAttribute(attrN)||''))
                aResponse[aResponse.length]=elm;
        }
        return aResponse;
    }
    Last edited by liorean; 09-24-2003 at 12:24 PM.
    liorean <[lio@wg]>
    Articles: RegEx evolt wsabstract , Named Arguments
    Useful Threads: JavaScript Docs & Refs, FAQ - HTML & CSS Docs, FAQ - XML Doc & Refs
    Moz: JavaScript DOM Interfaces MSDN: JScript DHTML KDE: KJS KHTML Opera: Standards

  • #3
    New Coder
    Join Date
    May 2003
    Posts
    15
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question

    I've tested the script a bit, but it does not work out of the box with me (my fault?).

    I had to put an if statement around this:
    if (attr){
    [code]
    attr=elm.getAttributeNode(attrN);
    if(re.test(attr.value))
    aResponse[aResponse.length]=elm;
    [code]
    };

    Code:
            aResponse=[];
            length,
    I had to remove length, and changed the aResponse=[]; in aResponse=[],
    and then it's working fine in Mozilla and IE6.

    IE5 does not know getAttributeNode ( http://www.xs4all.nl/~ppk/js/?version5.html ), so maybe it is better to rewrite the script with getAttribute?

    It looks like one can use regexp's for attribute values? That's cool!

    I don't know exactly the function of multi. Is it used when you want only the attribute values when it is part of more than one value (e.g. attr="value1 value2")?

    I think it's a great script.
    The problems I have with it, are probably because I don't understand every aspect of it.

  • #4
    Master Coder
    Join Date
    Feb 2003
    Location
    UmeŚ, Sweden
    Posts
    5,575
    Thanks
    0
    Thanked 83 Times in 74 Posts
    There were points to using getAttributeNode over getAttribute, but I can't remember exactly what at the moment. (I wrote this in April, so I can't exactly recall the basis of that choice.)

    The multi variable was originally intended for space separated lists such as the class attribute, but I found it could be used for comma separated lists and hyphen separated lists as well. Thus if false, this function matches the css [attrName=attrValue] syntax, while if true, it matches all of the the css syntaces [attrName~=attrValue], [attrName|=attrValue], [attrName*=attrValue].

    Hmm, I'll rewrite the ie5 version. Does the advanced version work as it should? (can't remember how much testing I did on this before I posted it)

    [:Edit:] Both are rewritten a bit, since it seems I had a not-quite-working source as starting point. Do they work?
    Last edited by liorean; 09-23-2003 at 11:08 PM.
    liorean <[lio@wg]>
    Articles: RegEx evolt wsabstract , Named Arguments
    Useful Threads: JavaScript Docs & Refs, FAQ - HTML & CSS Docs, FAQ - XML Doc & Refs
    Moz: JavaScript DOM Interfaces MSDN: JScript DHTML KDE: KJS KHTML Opera: Standards

  • #5
    New Coder
    Join Date
    May 2003
    Posts
    15
    Thanks
    0
    Thanked 0 Times in 0 Posts
    The first version only works in IE6. In MozFirebird I get the error message: attr has no properties.
    Version for IE5 now works fine in both IE6 and Mozilla.
    In IE5 I will test it tomorrow.
    As far as I can tell you can delete 'length,' in the list of variables.
    I'm going to bed now.

  • #6
    Master Coder
    Join Date
    Feb 2003
    Location
    UmeŚ, Sweden
    Posts
    5,575
    Thanks
    0
    Thanked 83 Times in 74 Posts
    Yep, length is an artefact from earlier versions. It's gone now. I've tried to fix the attr.value problem, don't know if I succeeded. (Too lazy to make a test page...)
    liorean <[lio@wg]>
    Articles: RegEx evolt wsabstract , Named Arguments
    Useful Threads: JavaScript Docs & Refs, FAQ - HTML & CSS Docs, FAQ - XML Doc & Refs
    Moz: JavaScript DOM Interfaces MSDN: JScript DHTML KDE: KJS KHTML Opera: Standards

  • #7
    New Coder
    Join Date
    May 2003
    Posts
    15
    Thanks
    0
    Thanked 0 Times in 0 Posts
    The second one works fine in IE5 and Mozilla.
    The fist one is not working.
    attr=elm.getAttributeNode(attrN); is returning null if there is no attribute specified. So attr.specified won't work.
    Making it this way: if(attr && re.test(attr.value))
    and it works.

  • #8
    Master Coder
    Join Date
    Feb 2003
    Location
    UmeŚ, Sweden
    Posts
    5,575
    Thanks
    0
    Thanked 83 Times in 74 Posts
    In fact, I'll have to check for all three of them, just to avoid the possible case of a value of null, which would then match a possible attribute sought for, with the name of null.
    liorean <[lio@wg]>
    Articles: RegEx evolt wsabstract , Named Arguments
    Useful Threads: JavaScript Docs & Refs, FAQ - HTML & CSS Docs, FAQ - XML Doc & Refs
    Moz: JavaScript DOM Interfaces MSDN: JScript DHTML KDE: KJS KHTML Opera: Standards

  • #9
    New Coder
    Join Date
    May 2003
    Posts
    15
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Originally posted by liorean
    In fact, I'll have to check for all three of them, just to avoid the possible case of a value of null, which would then match a possible attribute sought for, with the name of null.
    You are really paranoid
    I'll do some more advanced testing tomorrow.

  • #10
    Master Coder
    Join Date
    Feb 2003
    Location
    UmeŚ, Sweden
    Posts
    5,575
    Thanks
    0
    Thanked 83 Times in 74 Posts
    Me paranoid? <mumble>... he must be one of them... must be cautious...</mumble> I guess I'm a bit to set at what-I-consider-the-right-approach sometimes (including taking all possible cases in consideration), but paranoid?

    This discussion got me to remember something. This script and the testing of it is what prompted me to experiment and find this nice obscure Mozilla bug. Something hidden that deep in the implementation of something, you have to be paranoid to find...

    I prefer the word thorough to paranoid, though...
    liorean <[lio@wg]>
    Articles: RegEx evolt wsabstract , Named Arguments
    Useful Threads: JavaScript Docs & Refs, FAQ - HTML & CSS Docs, FAQ - XML Doc & Refs
    Moz: JavaScript DOM Interfaces MSDN: JScript DHTML KDE: KJS KHTML Opera: Standards

  • #11
    New Coder
    Join Date
    May 2003
    Posts
    15
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thorough!!! Yes, that was the word that I meant. Blame it on my bad English

    I've tested it a bit further.
    It seems to work fine now in IE and Moz.

    [attrName~=attrValue] and [attrName|=attrValue] do work now, as I can understand.

    But [attrName*=attrValue] does not work. Should it be supposed to work with how the script is done now?
    re=new RegExp(multi?'\\b'+attrV+'\[\^\\b\]\*\\b':'^'+attrV+'$')
    is making it a bit better, but
    re=new RegExp(multi?'\\b\.*?'+attrV+'\[\^\\b\]\*\\b':'^'+attrV+'$')
    (getting a headache of these escaped regexps)
    would make it perfect, although this is not working in IE5.

    With many thanks to your regexp tutorial on evolt

  • #12
    Master Coder
    Join Date
    Feb 2003
    Location
    UmeŚ, Sweden
    Posts
    5,575
    Thanks
    0
    Thanked 83 Times in 74 Posts
    Hmm, let me have a look at this... according to my testing (of just the regexes) it works in Moz, but I might be wrong.
    liorean <[lio@wg]>
    Articles: RegEx evolt wsabstract , Named Arguments
    Useful Threads: JavaScript Docs & Refs, FAQ - HTML & CSS Docs, FAQ - XML Doc & Refs
    Moz: JavaScript DOM Interfaces MSDN: JScript DHTML KDE: KJS KHTML Opera: Standards

  • #13
    Moderator
    Join Date
    May 2002
    Location
    Hayward, CA
    Posts
    1,453
    Thanks
    1
    Thanked 21 Times in 19 Posts

    Cool What, no namespaces?

    I wrote a little tutorial for George on DOM 2 TreeWalker, featuring a getElementsbyAttrMatch() method. It's a bit more advanced, and I'm waiting on clearance from George, but if you want a peek, let me know.

    Oh, that's right, IE doesn't really support XML namespaces... darn...
    "The first step to confirming there is a bug in someone else's work is confirming there are no bugs in your own."
    June 30, 2001
    author, Verbosio prototype XML Editor
    author, JavaScript Developer's Dictionary
    https://alexvincent.us/blog

  • #14
    Master Coder
    Join Date
    Feb 2003
    Location
    UmeŚ, Sweden
    Posts
    5,575
    Thanks
    0
    Thanked 83 Times in 74 Posts
    Heh, I thought of using either NodeIterator or TreeWalker, but gave them up in favour of iew support.

    I believe Chris Nott has a version of this using just those on his site, however.
    liorean <[lio@wg]>
    Articles: RegEx evolt wsabstract , Named Arguments
    Useful Threads: JavaScript Docs & Refs, FAQ - HTML & CSS Docs, FAQ - XML Doc & Refs
    Moz: JavaScript DOM Interfaces MSDN: JScript DHTML KDE: KJS KHTML Opera: Standards

  • #15
    New Coder
    Join Date
    May 2003
    Posts
    15
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I'm interested in the tutorial, although I can wait for George (!?)


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

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