开发者

Get Html Attributes inside div

<div>
  <table>
       <tr>
            <td>
                <input type="text" id="one" value="1" name="textbox"/>
            </td>
              <td>
    开发者_如何学编程            <input type="hidden" id="two" value="2" name="hidden"/>
              </td> 
        </tr>
         <tr>
             <td>
                <input type="radio" name="group2" value="Water"> Water<br>
                <input type="radio" name="group2" value="Beer"> Beer<br>
             </td>
              <td>
                <span id="sdf" title="sdf">ok</span>
               </td>
          </tr>
</table>
<div>

Get Html Attributes inside div,How to get attribute like type,name,value from above div using dom(traversing) for each elements like input,span etc


a simple search on google returned this guide for javascript. here you can find everything you need


I assume you're asking how to do this with javascript. Here's sample code for the objects with id values. For the other values, put id names on them too and use the same technique.

var input_one = document.getElementById("one");
var input_two = document.getElementById("two");

alert("Input one: type='" + input_one.type + "', name='" + input_one.name + "', value='" + input_one.value + "'");

And a fiddle that shows it in action: http://jsfiddle.net/jfriend00/nZyjN/


using getAttribute( "type" ) we can get value of the particular attribute


The querySelectorAll(selectors) method allows you, for a given element, to retrieve an array of its descendant elements that match given criteria.

For example:

// Replace "yourDiv" with a reference to you main div
var elements = yourDiv.querySelectorAll("input, span");
for (var i = 0; i < elements.length; i++) {
    var element = elements[i];
    var name = element.name;
    var type = element.type;
    var value = element.value;
    // Now you can do what you want with name, type and value, for example:
    alert("Name: "+name+"\r\n"+"Type: "+type+"\r\n"+"Value: "+value);
}

According to the Mozilla Developer Network the querySelectorAll method is supported in IE8, Fx3.5, Chrome1, Opera 10 and Safari 3.2.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜