Question

有没有办法知道页面上所有对象的ID和名称？任何工具？

Answer 1

使用jQuery（console.log的+ FireBug）：

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

Answer 2

以下XPath表达式返回具有id属性或name属性的所有元素：

//*[@id or @name]

您可以使用Firebug Firefox Add-on进行测试，例如在控制台中输入：

$x('//*[@id or @name]')

Answer 3

最实用的方法是使用完全封装网页的DIV。有了这个，你可以查看它的所有子元素。

页面：

<html>
<head>
  <title>Awesome Page</title>
  <!-- Script Below Goes Here -->
</head>
<body>
<div id="everything">
<!-- All your elements on page -->
</div>
</body>
</html>

剧本：

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

[HTML]：确定页面上所有元素的名称

3 个答案: