js中设置样式的几种方式（setAttribute，className）
【摘要】 以设置背景色为例子
可以用单一的backgroundColor 可以用className 可以用setAttribute（setAttribute 和 removeAttribute）为一组
实例代码（实现效果点击一个按钮，就把整个背景色替换，点击其他的就换其他的）
<html> <head> <title></title> <style type="text/...
以设置背景色为例子
可以用单一的backgroundColor
可以用className
可以用setAttribute（setAttribute 和 removeAttribute）为一组
实例代码（实现效果点击一个按钮，就把整个背景色替换，点击其他的就换其他的）
-
<html>
-
-
<head>
-
-
<title></title>
-
-
<style type="text/css">
-
.bg{
-
background-color : "blue" ;
-
}
-
</style>
-
-
<script language="javascript" type="text/javascript">
-
window.onload = function(){
-
-
$("redC").onclick = function(){
-
document.body.removeAttribute("className","bg");
-
document.body.style.backgroundColor = "red";
-
}
-
$("blueC").onclick = function(){
-
document.body.style.backgroundColor = "";
-
-
document.body.setAttribute("className","bg");
-
// document.body.className = "bg";
-
}
-
-
$("pinkC").onclick = function(){
-
document.body.removeAttribute("className","bg");
-
document.body.style.backgroundColor = "pink";
-
}
-
-
$("blackC").onclick = function(){
-
document.body.removeAttribute("className","bg");
-
document.body.style.backgroundColor = "black";
-
}
-
}
-
-
function $(uid){
-
return document.getElementById(uid);
-
}
-
</script>
-
-
</head>
-
-
<body>
-
<input type="button" value="red" id="redC"/>
-
<input type="button" value="blue" id="blueC"/>
-
<input type="button" value="pink" id="pinkC"/>
-
<input type="button" value="black" id="blackC"/>
-
</body>
-
-
</html>
文章来源: bugstack.blog.csdn.net，作者：小傅哥，版权归原作者所有，如需转载，请联系作者。
原文链接：bugstack.blog.csdn.net/article/details/7891697
【版权声明】本文为华为云社区用户转载文章，如果您发现本社区中有涉嫌抄袭的内容，欢迎发送邮件进行举报，并提供相关证据，一经查实，本社区将立刻删除涉嫌侵权内容，举报邮箱：
cloudbbs@huaweicloud.com
- 点赞
- 收藏
- 关注作者
评论（0）