日常学习《js权威指南》第16.6.1节开启和关闭样式表。
作者写了这样的代码
function disableStylesheet (ss) {
if( typeof ss === "number")
document.styleSheets[ss].disabled = true;
else {
var sheets = document.querySelectorAll(ss);
for(var i = 0 ;i < sheets.length; i++)
sheets[i].disabled = true;
}
}
自己写了代码为实验:
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>16.6.1开启关闭样式表</title>
<script type="text/javascript">
function disableStylesheet (ss) {
// body...
if( typeof ss === "number")
document.styleSheets[ss].disabled = true;
else {
var sheets = document.querySelectorAll(ss);
for(var i = 0 ;i < sheets.length; i++)
sheets[i].disabled = true;
}
}
</script>
<link rel="stylesheet" type="text/css" href="css/hello.css">
<link rel="stylesheet" type="text/css" href="css/ss.css">
</head>
<body>
<p id="hello">你好</p>
<p id="ss">ss</p>
</body>
</html>
<!--试验内容
disableStylesheet(0)
disableStylesheet("#ss")
-->对于 disableStylesheet(0)，没有问题
而 disableStylesheet("#ss")并不能顺利关闭其样式，
问题：
1.可以通过选择元素，然后关闭样式表吗？
2.如何清除元素的样式？
3.这个函数这样写是不是有问题？
PHP中文网2017-04-11 11:28:09
disableStylesheet是用来关闭link[rel=stylesheet]的效果的。
你的#ss是一个p的dom元素，当然没有效果喽。顶多让#ss多了一个disabled的属性
试试这个:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>16.6.1开启关闭样式表</title>
<script type="text/javascript">
function disableStylesheet (ss) {
// body...
if( typeof ss === "number")
document.styleSheets[ss].disabled = true;
else {
var sheets = document.querySelectorAll(ss);
for(var i = 0 ;i < sheets.length; i++)
sheets[i].disabled = true;
}
}
disableStylesheet("#ssStyle"); // 这样应该可以
</script>
<link rel="stylesheet" type="text/css" href="css/hello.css">
<link rel="stylesheet" id="ssStyle" type="text/css" href="css/ss.css">
</head>
<body>
<p id="hello">你好</p>
<p id="ss">ss</p>
</body>
</html>