gpt4 book ai didi

javascript - document.styleSheets 删除了 Webkit 特定的 CSS 规则

转载 作者:太空宇宙 更新时间:2023-11-04 11:51:31 25 4
gpt4 key购买 nike

看看这个HTML, CSS and JavaScript :

<html>
<head>
<style type="text/css">
body {
-webkit-text-size-adjust: none;
font-size: 14px;
}
html{
padding: 0;
}
</style>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$.each(document.styleSheets, function () {
var cssRules = this.cssRules;
if (cssRules && cssRules.length && this.href === null) {
var css = '';
$.each(cssRules, function () {
css += this.cssText;
});
document.write(css);
}
});
})
</script>
</head>
<body>

</body>
</html>

基本上,它所做的就是通过document.styleSheets输出当前文档中用JS读取的样式表。
现在,问题是:document.styleSheets 不包含 Webkit 特定样式。相反,这些样式已被删除。
在我的示例中,body 具有 -webkit-text-size-adjust: none; 但此规则未输出,如您在右侧所见。
这是为什么?
更重要的是:如何通过 document.styleSheets 获取该规则?

最佳答案

“文本大小调整”isn't supported by any non-mobile browsers ,所以如果您在桌面上执行此操作,它不会出现,因为浏览器实际上不存在该规则。

如果您使用受支持的规则(如下所示)尝试您的代码,您将在 document.write() 中看到带有 vendor 前缀的规则

body {
-webkit-transition: all 4s ease;
font-size: 14px;
font-weight: bold;
}

关于javascript - document.styleSheets 删除了 Webkit 特定的 CSS 规则,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30598185/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com