如何通过Javascript访问元素的焦点/hover/访问CSS属性？

我现在可能很累并且很奇怪，但我根本找不到如何检索元素的聚焦，hover或访问状态中定义的CSS属性的值。 目标是使用Javascript中的值。

重要提示 ：我不需要获得聚焦/hover/访问过的元素 。 我想访问DOM 中任何元素的某些值，并为以下状态定义CSS属性 :focus ， :hover和:visited 。

在这种情况下，这些伪类似乎没有帮助，所以我是否需要触发相应的状态才能访问这些值？

它应该比这简单……或者不是吗？

PS：素食Javascript或jQuery的答案会做。

Answer 1

是的，您可以通过阅读样式表来实现这一点。 您可以使用document.styleSheets获取它; 下面是示例和jsfiddle链接。

http://jsfiddle.net/wt3qQ/

出于安全原因 ，Opera和Mozilla不允许您从其他域或协议访问样式表的cssRules集合。 尝试访问它将引发安全违规错误

 function getStyleBySelector( selector ) { var sheetList = document.styleSheets; var ruleList; var i, j; /* look through stylesheets in reverse order that they appear in the document */ for (i=sheetList.length-1; i >= 0; i--) { ruleList = sheetList[i].cssRules; for (j=0; j