[HTML]: Determine names of all elements on a page_问答_开发者

[HTML]: Determine names of all elements on a page

开发者 https://www.devze.com 2022-12-09 15:07 出处：网络

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):

相关专题：

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 + "&nbsp&nbsp";
    str += "<b}>Name:</b>" + elem[i].name + "&nbsp;&nbsp;";
    str += "<b>Value:</b><i>" + elem[i].value + "</i>&nbsp;&nbsp;";
    str += "<BR>";
  }
}
</script>