如何找到元素的所有可能的 CSS 样式和属性？答案

【问题标题】：How to find all possible CSS Styles and Attributes of an Element?如何找到元素的所有可能的 CSS 样式和属性？
【发布时间】：2013-04-14 10:29:37
【问题描述】：

有一些方法可以获取使用 style 或 class 属性设置的 DOM 元素的所有 CSS 样式。这很好用，但如果类未设置为此，则无法找到可以设置为此元素的类。

现在我正在寻找一种方法来获取所有可能设置为此 DOM 元素的 CSS 类和样式。我用 RegExp 尝试了一些东西，但它并不完美，因为我不确定如何搜索文档样式节点并将其与 DOM 节点进行比较。这怎么可能？

我需要的示例：

<div class="set">
  <p class="anotherclass">some text</p>
  <p class="otherClass">some text</p>
</div>

CSS：

div.set { /* some css */ }
div.notSet { /* you could find me but not want to set me */ }
.autoSet_findMeToSet { /* set me to all tags with jquery */ }
div.autoSet_setMeNow { /* set me to the div tag with jquery */ }
div > p:first-child.autoSet_yeah { /* set me to the first p tag with jquery */
/* and so on */

如您所见，我想用 jQuery 设置所有具有特殊名称的 css 类。使用正则表达式我可以找到类名，但我不知道如何检查它需要设置到哪个 dom 元素（html 标记）...

非常感谢您的帮助！

【问题讨论】：

您是否要获取一个元素的所有继承 CSS 规则？
是的，我想 :) 我想找到所有可能为给定设置或使用的 CSS 规则（在和
这个问题太模糊了。什么是“CSS 样式和属性”？你的意思是CSS属性，还是别的什么？什么是“CSS 类”？您实际上是指 HTML 类吗？（CSS 没有类，只有类选择器。）您尝试在 jQuery 或 JavaScript 中做什么？
这个问题似乎没有任何意义，any 类可以应用于 any 元素。我不认为，正如问题所写（当然，我可能误解了你的意图），有任何明确的答案要给出。你能给出说明性的输入/输出吗？
对不起，我不好用英语描述 :) 请看一下上面的 CSS 示例。我想在选定的 HTML 标记（如 P）中找到以“.autoSet_....”开头的 CSS 文件中的所有 HTML 类。就像我说的“$('body > p').getPossibleCSS() -> 将返回我 .autoSet_findMeToSet ... $('body div > p:first-child').getPossibleCSS() 将返回我 .autoSet_findMeToSet还有来自 div > p:first-child.autoSet_yeah 的 .autoSet_yeah，所以 p 标签不能在 DOM 中设置类属性，但我需要在 css 中找到可能设置为此的类（.autoSet_. ..)

标签： javascript jquery css dom

【解决方案1】：

您可以使用 jQuery $.contains() 检查找到的元素是否在其他元素中

更多信息在这里如何做到这一点：http://api.jquery.com/jQuery.contains/

因此，对于您的示例，您可以执行以下操作：

$.each(foundElement, function(index, domElement){
    if($.contains(domElement, $('.set'))) {
        // domElement is inside the container with 'set' class
    } else {
        // domElement is not inside the container with 'set' class
    }
});

【讨论】：

【解决方案2】：

如果我正确理解问题：

$(".class *")

选择类class的元素内的所有元素

$(".class").find(element).length === 0

检查元素是否在类class的元素内

【讨论】：

感谢您的回答，但这不是我认为的解决方案。因为我不知道某个班级的名字。我只知道一些元素，我需要知道可以为这个元素设置哪些类和样式（但目前甚至没有设置）