JS添加或修改控件的样式(Class)实现方法


Posted in Javascript onOctober 15, 2016

使用js 给页面组件添加class 或者删除class,以及使用jquery的方式添加或修改。

<input id="txtBianCeng" type="text" /> 
   
.lezhu99 { 
  color:#cc0000; 
} 
   
添加或修改样式(Class) 
document.getElementById("txtBianCeng").className = "lezhu99"; 
   
删除样式(Class) 
document.getElementById("txtBianCeng").className = "";

需要注意的是,在 JavaScript 中,样式使用的是 className 去访问 class 属性,非 class,因为 class 是一个保留关键字,谨记这一点。

如果是使用 jQuery修改标记的样式(Class) 就不一样了,它是使用 removeClass 和 addClass 方法进行删除样式和添加(修改)样式的。

以上就是小编为大家带来的JS添加或修改控件的样式(Class)实现方法全部内容了,希望大家多多支持三水点靠木~

Javascript 相关文章推荐
jQuery示例收集
Nov 05 Javascript
js取两个数组的交集|差集|并集|补集|去重示例代码
Aug 07 Javascript
jquery创建表格(自动增加表格)代码分享
Dec 25 Javascript
extjs_02_grid显示本地数据、显示跨域数据
Jun 23 Javascript
JavaScript计算两个日期时间段内日期的方法
Mar 16 Javascript
Js数组排序函数sort()介绍
Jun 08 Javascript
JavaScript中判断两个字符串是否相等的方法
Jul 07 Javascript
jqueryMobile使用示例分享
Jan 12 Javascript
js前端日历控件(悬浮、拖拽、自由变形)
Mar 02 Javascript
JavaScript中引用vs复制示例详析
Dec 06 Javascript
vue用elementui写form表单时,在label里添加空格操作
Aug 13 Javascript
vue swipeCell滑动单元格(仿微信)的实现示例
Sep 14 Javascript
原生JS实现的放大镜效果实例代码
Oct 15 #Javascript
jQuery通过ajax方法获取json数据不执行success的原因及解决方法
Oct 15 #Javascript
Bootstrap分页插件之Bootstrap Paginator实例详解
Oct 15 #Javascript
jstl中判断list中是否包含某个值的简单方法
Oct 14 #Javascript
js中获取 table节点各tr及td的内容简单实例
Oct 14 #Javascript
jQuery ajaxForm()的应用
Oct 14 #Javascript
jQuery的 $.ajax防止重复提交的两种方法(推荐)
Oct 14 #Javascript
You might like
php SQL Injection with MySQL
2011/02/27 PHP
php调用mysql数据 dbclass类
2011/05/07 PHP
基于Zend的Captcha机制的应用
2013/05/02 PHP
PHP采用get获取url汉字出现乱码的解决方法
2014/11/13 PHP
magento后台无法登录解决办法的两种方法
2016/12/09 PHP
基于jquery实现的表格分页实现代码
2011/06/21 Javascript
js 编码转换 gb2312 和 utf8 互转的2种方法
2013/08/07 Javascript
js操作IE浏览器弹出浏览文件夹可以返回目录路径
2014/07/14 Javascript
javascript中in运算符用法分析
2015/04/28 Javascript
Javascript页面跳转常见实现方式汇总
2015/11/28 Javascript
微信小程序  网络请求API详解
2016/10/25 Javascript
jQuery实现简单弹窗遮罩效果
2017/02/27 Javascript
深入解析nodejs HTTP服务
2017/07/25 NodeJs
React key值的作用和使用详解
2018/08/23 Javascript
关于vue编译版本引入的问题的解决
2018/09/17 Javascript
Layui表格行工具事件与数据回填方法
2019/09/13 Javascript
vuex中遇到的坑,vuex数据改变,组件中页面不渲染操作
2020/11/16 Javascript
python爬虫入门教程之点点美女图片爬虫代码分享
2014/09/02 Python
Python随手笔记第一篇(2)之初识列表和元组
2016/01/23 Python
解决python中使用plot画图,图不显示的问题
2018/07/04 Python
Python简直是万能的,这5大主要用途你一定要知道!(推荐)
2019/04/03 Python
python基于paramiko将文件上传到服务器代码实现
2019/07/08 Python
python实现发送form-data数据的方法详解
2019/09/27 Python
浅析Python迭代器的高级用法
2020/07/16 Python
python实现磁盘日志清理的示例
2020/11/05 Python
个性化皮包、小袋、生活配件:Mon Purse
2019/03/26 全球购物
迪卡侬比利时官网:Decathlon比利时
2019/12/28 全球购物
金融专业个人的自我评价
2013/10/18 职场文书
三年级科学教学反思
2014/01/29 职场文书
求职信范文怎么写
2014/01/29 职场文书
财产保全担保书范文
2014/04/01 职场文书
电子专业毕业生自荐信
2014/05/25 职场文书
七一讲话心得体会
2014/09/05 职场文书
2014年初中班主任工作总结
2014/11/08 职场文书
2014年社区工作总结
2014/11/18 职场文书
JavaScript canvas实现流星特效
2021/05/20 Javascript