是否有跨浏览器的方法来确定通过JavaScript手动设置了哪些CSS属性?或者,可能是样式属性覆盖了哪些CSS属性?
是cssText
属性标准和跨浏览器:document.getElementById('id').style.cssText
?
另一种可能的解决方案是使用包装器功能。最简单的例子:
function css(node, prop, value)
{
$(node).css(prop, value);
memory[node][prop] = value; // remember that we set prop for the node
}
最佳答案
您可以随时获取style属性并提取值:
非JQuery想法:
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title></title>
</head>
<body>
<span id="aspan" style="color:red; background-color: blue;">Hey Hey Hey</span>
<script>
String.prototype.trim = function () {
return this.replace(/^\s*/, "").replace(/\s*$/, "");
}
var sp = document.getElementById("aspan");
var stys = sp.getAttribute("style").split(";");
var rules = {};
for(var i=0; i<stys.length;i++){
var sty = stys[i].split(":");
if(sty.length>=2){
rules[sty.shift().trim().toLowerCase()] = sty.join(":").trim();
}
}
alert(rules["color"]);
alert(rules["background-color"]);
</script>
</body>
</html>
JSBIN
这不会捕获通过JS代码添加的内容。又名
elem.style.foo="bar"