编程 Javascript

JavaScript操作class和style样式代码详解

Posted in Javascript onFebruary 13, 2016

废话不多说了，直接给大家贴js代码了，具体代码如下所示：

<!doctype html>
<html>
<head>
<meta charset="utf-">
<title>无标题文档</title>
<style>
.fontSize
{
font-size:px;
}
.fontWeight
{
font-weight:bold;
}
</style>
</head>
<body>
<div id="div" class="fontSize fontWeight" style="color:red">div实例文本</div>
<button onclick="changeStyle()">changeStyle()</button>
<script>
function changeStyle()
{
var div = document.getElementById("div");
//div.className = "fontSize";
//div.className += " fontWeight";
//删除单个class=""样式
//div.className = div.className.replace(/fontSize/,"");
//删除所有class=""样式
//div.removeAttribute("class");
//删除style=""中的单个样式
div.style.cssText = div.style.cssText.replace(/red/,"blue");
//删除style=""中的所有样式
//div.style.cssText = "";
}
</script>
</body>
</html>

以上内容是针对JavaScript操作class和style样式代码详解的全部内容，希望对大家有所帮助。

- Author -

cag2050

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

Extjs中常用表单介绍与应用

Jun 07 Javascript

写js时遇到的一些小问题

Dec 06 Javascript

jquery序列化表单以及回调函数的使用示例

Jul 02 Javascript

js实现动画特效的文字链接鼠标悬停提示的方法

Mar 02 Javascript

JS+CSS实现Div弹出窗口同时背景变暗的方法

Mar 04 Javascript

详解jquery事件delegate(）的使用方法

Jan 25 Javascript

深入学习AngularJS中数据的双向绑定机制

Mar 04 Javascript

Bootstrap每天必学之折叠

Apr 12 Javascript

JavaScript中清空数组的方法总结

Dec 02 Javascript

ES6 系列之 WeakMap的使用示例

Aug 06 Javascript

详解vuex的简单todolist例子

Jul 14 Javascript

开发Node CLI构建微信小程序脚手架的示例

Mar 27 Javascript

javascript实现查找数组中最大值方法汇总

Feb 13 #Javascript

JavaScript常用数组算法小结

Feb 13 #Javascript

Javascript 字符串模板的简单实现

Feb 13 #Javascript

javascript基础知识分享之类与函数化

Feb 13 #Javascript

JavaScript正则表达式的分组匹配详解

Feb 13 #Javascript

js HTML5 Ajax实现文件上传进度条功能

Feb 13 #Javascript

js随机生成26个大小写字母

Feb 12 #Javascript