regular expression to extract all the attributes of a div

I have a requirement to extract the all the attributes of some tag. so i want to go for regex for this.for example <sometag attr1="val1" attr2="v开发者_StackOverflowal2" ></sometag>. i want the attributes and values as name value pairs.

Any help appreciated

thanks

var s = '<sometag attr1="val1" attr2="val2" ></sometag>';
var reg = /\s(\w+?)="(.+?)"/g;
while( true ) {
    var res = reg.exec( s );
    if( res !== null ) {
        alert( 'name = '+res[1] );
        alert( 'value = '+res[2] );
    } else {
        break;
    }
}

preg_match_all( '/\s(\w+?)="(.+?)"/', '<sometag attr1="val1" attr2="val2" ></sometag>', $matches );
for( $i = 0; $i < count( $matches[1] ); ++$i ) {
    $name = $matches[1][$i];
    $value = $matches[2][$i];
    echo 'name'.$i.' = "'.$name.'", value'.$i.' = "'.$value.'", ';
}

result:

name0 = "attr1", value0 = "val1", name1 = "attr2", value1 = "val2",  

of course you need to tweak this to fit your need and deal with bad html.

You could use [jquery][1] to get all attrubutes of an element

$('sometag').getAttributes();

http://plugins.jquery.com/project/getAttributes

A regex is not required. Much easier, use Element.attributes():

var attributes = element.attributes();

"Returns an array (NamedNodeMap) containing all the attributes defined for the element in question, including custom attributes." See the link for examples on how to access each attribute and it's value.

You can't do this in native JavaScript by using a regular expression. Using native JavaScript you have a couple of basic options. You can enumerate all of the node's properties and intelligently filter to get just the things you want, like:

window.extractAttributes = function(node) {
    var attribString = "";
    var template = document.createElement(node.tagName);
    template.innerHTML = node.innerHTML;
    for (var key in node) {
        if (typeof node[key] == "string" && node[key] != "" && ! template[key]) {
            if (attribString.length > 0) {
                attribString += ", ";
            }
            attribString += key + "=" + node[key];
        }
    }

    return attribString;
};

Or you can use Element.attributes to iterate the list of declared attributes (note that this may not detect non-standard attribute values that are added dynamically at runtime), like:

window.extractAttributesAlternate = function(node) {
    var attribString = "";
    for (var index = 0; index < node.attributes.length; index++) {
        if (attribString.length > 0) {
            attribString += ", ";
        }
        attribString += node.attributes[index].name+ "=" + node.attributes[index].nodeValue;
    }

    return attribString;
}; 

Note that the first approach may not pick up custom attributes that have been defined in the page markup, and that the second approach may not pick up custom attributes that have been defined dynamically by JavaScript on the page.

Which gives us option 3. You can enumerate the attributes both ways, and then merge the results. This has the benefit of being able to reliably pick up upon any custom attributes no matter when/how they were added to the element.

Here's an example of all 3 options: http://jsfiddle.net/cgj5G/3/

You can use XML parser, because provided input is well-formed XML.

Do not use Regex for this! Javacript's DOM already has all the information you need, easily accessible.

List all attributes of a DOM element:

var element = document.getElementById('myElementName');
var attributes = element.attributes;
for(var attr=0; attr<attributes.length; attr++) {
    alert(attributes[attr].name+" = "+attributes[attr].nodeValue);
}

(tested above code in FF5, IE8, Opera11.5, Chrome12: Works in all of them, even with non-standard attributes)

Given the text of a single element which includes its start and end tags (equivalent of the element's outerHTML), the following function will return an object containing all of the attribute name=value pairs. Each attribute value can be single quoted, double quoted or un-quoted. Attribute values are optional and if not present will take on the attribute's name.

function getElemAttributes(elemText) {
    // Regex to pick out start tag from start of element's HTML.
    var re_start_tag = /^<\w+\b(?:\s+[\w\-.:]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[\w\-.:]+))?)*\s*\/?>/;
    var start_tag = elemText.match(re_start_tag);
    start_tag = start_tag ? start_tag[0] : '';
    // Regex to pick out attribute name and (optional) value from start tag.
    var re_attribs = /\s+([\w\-.:]+)(\s*=\s*(?:"([^"]*)"|'([^']*)'|([\w\-.:]+)))?/g;
    var attribs = {};   // Store attribute name=value pairs in object.
    var match = re_attribs.exec(start_tag);
    while (match != null) {
        var attrib = match[1];  // Attribute name in $1.
        var value  = match[1];  // Assume no value specified.
        if (match[2]) { // If match[2] is set, then attribute has a value.
            value = match[3] ? match[3] : // Attribute value is in $3, $4 or $5.
                    match[4] ? match[4] : match[5];
        }
        attribs[attrib] = value;
        match = re_attribs.exec(start_tag);
    }
    return attribs;
}

Given this input:

<sometag attr1="val1" attr2='val2' attr3=val3 attr4 >TEST</sometag>

This is the output:

attrib = {
    attr1: "val1",
    attr2: "val2",
    attr3: "val3",
    attr4: "attr4"
    };