本文介绍了如何获得元素:悬停样式?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我需要帮助,我想获得 element:hover 所有样式.例如:
I need help, I want to get element:hover all styles.For example:
<style type="text/css">
a {color: red;}
a:hover {color: blue;}
</style>
使用jquery我们可以找到a"元素的默认样式:
Using jquery we can find "a" element default style:
$('a').css('color');
它将以字符串形式返回:"red";
and it will be return as string: "red";
但现在我想获得伪样式,如下所示:
But now I want to get pseudo styles, like this:
$('a:hover').css('color');
它会返回undefined",但我们需要blue".
and it will be return "undefined", but we need "blue".
请帮我解决这个问题...
Please help me solve this problem...
推荐答案
纯 Javascript 做到了!
Pure Javascript does it!
function getCssPropertyForRule(rule, prop) {
var sheets = document.styleSheets;
var slen = sheets.length;
for(var i=0; i<slen; i++) {
var rules = document.styleSheets[i].cssRules;
var rlen = rules.length;
for(var j=0; j<rlen; j++) {
if(rules[j].selectorText == rule) {
return rules[j].style[prop];
}
}
}
}
alert("Hovered Colour is "+getCssPropertyForRule('a:hover', 'color'));
这是一个工作示例jsfiddle
Here is a Working examplejsfiddle
这篇关于如何获得元素:悬停样式?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!