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样式代码详解的全部内容,希望对大家有所帮助。

Javascript 相关文章推荐
js 对联广告、漂浮广告封装类(IE,FF,Opera,Safari,Chrome
Nov 26 Javascript
jQuery 表格工具集
Apr 25 Javascript
javascript开发技术大全-第1章javascript概述
Jul 03 Javascript
jQuery 数据缓存模块进化史详细介绍
Nov 19 Javascript
js自动生成的元素与页面原有元素发生堆叠的解决方法
Oct 24 Javascript
JS定义类的六种方式详解
May 12 Javascript
基于jQuery封装的分页组件
Jun 26 jQuery
JavaScript事件发布/订阅模式原理与用法分析
Aug 21 Javascript
javascript对HTML字符转义与反转义
Dec 13 Javascript
JS中的防抖与节流及作用详解
Apr 01 Javascript
简单了解前端渐进式框架VUE
Jul 20 Javascript
vue中路由跳转不计入history的操作
Sep 21 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
You might like
php实时倒计时功能实现方法详解
2017/02/27 PHP
php两点地理坐标距离的计算方法
2018/12/29 PHP
Laravel中validation验证 返回中文提示 全局设置的方法
2019/09/29 PHP
jquery中输入验证中一个不错的效果
2010/08/21 Javascript
jQuery控制图片的hover效果(smartRollover.js)
2012/03/18 Javascript
jquery实现图片按比例缩放示例
2014/07/01 Javascript
jQuery中:submit选择器用法实例
2015/01/03 Javascript
js判断上传文件后缀名是否合法
2016/01/28 Javascript
JS中setTimeout的巧妙用法前端函数节流
2016/03/24 Javascript
ECMAScript6快速入手攻略
2016/07/18 Javascript
JS面试题---关于算法台阶的问题
2016/07/26 Javascript
nodeJs内存泄漏问题详解
2016/09/05 NodeJs
JQuery和HTML5 Canvas实现弹幕效果
2017/01/04 Javascript
JS对象的深度克隆方法示例
2017/03/16 Javascript
webpack 4.0.0-beta.0版本新特性介绍
2018/02/10 Javascript
Javascript格式化并高亮xml字符串的方法及注意事项
2018/08/13 Javascript
jQuery添加新内容的四个常用方法分析【append,prepend,after,before】
2019/03/19 jQuery
vue实现分页的三种效果
2020/06/23 Javascript
Python中urllib2模块的8个使用细节分享
2015/01/01 Python
详细解读tornado协程(coroutine)原理
2018/01/15 Python
Python实现读取Properties配置文件的方法
2018/03/29 Python
Python中变量的输入输出实例代码详解
2019/07/28 Python
python 3.7.4 安装 opencv的教程
2019/10/10 Python
pytorch 求网络模型参数实例
2019/12/30 Python
Tensorflow 使用pb文件保存(恢复)模型计算图和参数实例详解
2020/02/11 Python
关于pycharm 切换 python3.9 报错 ‘HTMLParser‘ object has no attribute ‘unescape‘ 的问题
2020/11/24 Python
俄罗斯隐形眼镜和眼镜在线商店:Cronos
2020/06/02 全球购物
TCP/IP中的TCP和IP分别承担什么责任
2012/04/21 面试题
三月学雷锋月活动总结
2014/04/28 职场文书
2014最新党员违纪检讨书
2014/10/12 职场文书
贫困生助学金感谢信
2015/01/21 职场文书
六一儿童节园长致辞
2015/07/31 职场文书
2016年度员工工作表现评语
2015/12/02 职场文书
《水上飞机》教学反思
2016/02/20 职场文书
MySQL索引知识的一些小妙招总结
2021/05/10 MySQL
Mysql查询时间区间日期列表,不会由于数据表数据影响
2022/04/19 MySQL