[HTML]: Determine names of all elements on a page
Is there any way to know the IDs and Names of all the objects on a pag开发者_开发技巧e? Any tool?
with jQuery (+ FireBug for console.log
):
var ids = [], names = [];
jQuery('body *').each(function(){
var id = $(this).attr('id'),
name = $(this).attr('name');
id && ids.push(id);
name && names.push(name);
});
console.log(ids, names);
The following XPath expression returns all elements that have either an id
attribute or a name
attribute:
//*[@id or @name]
You can test that using the Firebug Firefox Add-on for example by entering this in its console:
$x('//*[@id or @name]')
The most practical way to do this is to have a DIV that totally encapsulates your webpage. With this, you can view all it's child elements.
The Page:
<html>
<head>
<title>Awesome Page</title>
<!-- Script Below Goes Here -->
</head>
<body>
<div id="everything">
<!-- All your elements on page -->
</div>
</body>
</html>
The Script:
<script type="text/javascript">
function DisplayFormValues()
{
var str = '';
var elem = document.getElementById('everything').elements;
for(var i = 0; i < elem.length; i++)
{
str += "<b>Type:</b>" + elem[i].type + "  ";
str += "<b}>Name:</b>" + elem[i].name + " ";
str += "<b>Value:</b><i>" + elem[i].value + "</i> ";
str += "<BR>";
}
}
</script>
精彩评论