Javascript定位所有带边距元素的方法:auto

Question

我正在寻找一种简单的方法来在页面上找到边距左边和边距右边设置为自动的元素.

我有这个脚本,这有时帮助我:

(function() {
  var elementsList = [];
  for (var i = 0; i < document.styleSheets.length; i++) {
    var styleSheet = document.styleSheets[i];
    if (styleSheet.rules) {
      for (var j = 0; j < styleSheet.rules.length; j++) {
        var rule = styleSheet.rules[j];
        if (rule && rule.style && rule.style.marginLeft == 'auto' && rule.style.marginRight == 'auto') {
          var smallList = document.querySelectorAll(rule.selectorText);
          if (smallList.length)
            elementsList = elementsList.concat(smallList);

        }

      }
    }
  }
  return elementsList
})();

虽然这个功能完成了一些工作,但它并没有抓住margin: auto我在网站上看到的大多数情况.

你能告诉我一个更好的方法吗？

Answer 1

如果您可以使用 JQuery

正如 Martin Ernst 对于 yonatan 的回答所说：“这将仅选择 marginLeft/Right="auto" 的元素。”

此外，正如评论中所述，必须隐藏元素才能与 FF 和 safari 配合使用。

这应该可以使用 JQuery 工作：

$(document).ready(function() {
    var visibleElements = $('body *:visible');
    $('body *').hide();
    var elements = $('body *').filter(function() {
        return $(this).css('margin-left') == 'auto' && $(this).css('margin-right') == 'auto';
    })
    // show only elements that were visible
    visibleElements.show();
});

提示：如果由于某种原因，您不需要加载外部脚本，只需将缩小的 jquery 脚本的内容复制到您的脚本的开头即可。