js css样式操作代码(批量操作)


Posted in Javascript onOctober 09, 2009

我们用js书写css样式通常会用下面的两种方式:

一般情况下我们用js设置元素对象的样式会使用这样的形式:

var element= document.getElementById(”id”); 
element.style.width=”20px”; 
element.style.height=”20px”; 
element.style.border=”solid 1px red”;

但是上面的方法有一个缺点,样式一多,代码就很多;而且通过JS来覆写对象的样式是比较典型的一种销毁原样式并重建的过程,这种销毁和重建,都会增加浏览器的开销。

js中有一个cssText的方法:
语法为:obj.style.cssText(”样式”);
上面的代码我们可以修改成:

element.style.cssText=”width:20px;height:20px;border:solid 1px red;”;

这种写法可以尽量避免页面的多次reflow,提高页面性能。
Javascript 相关文章推荐
JavaScript数组深拷贝和浅拷贝的两种方法
Apr 16 Javascript
javascript中的nextSibling使用陷(da)阱(keng)
May 05 Javascript
jQuery过滤选择器用法分析
Feb 10 Javascript
谈谈jQuery Ajax用法详解
Nov 27 Javascript
利用浮层使select不可选的实现方法
Dec 03 Javascript
微信小程序 数据封装,参数传值等经验分享
Jan 09 Javascript
Bootstrap页面缩小变形的快速解决办法
Feb 03 Javascript
解决vue页面DOM操作不生效的问题
Mar 17 Javascript
JS代码实现电脑配置检测功能
Mar 21 Javascript
Vue 让元素抖动/摆动起来的实现代码
May 31 Javascript
解决ant design vue 表格a-table二次封装,slots渲染的问题
Oct 28 Javascript
JavaScript 异步时序问题
Nov 20 Javascript
防止动态加载JavaScript引起的内存泄漏问题
Oct 08 #Javascript
JavaScript delete 属性的使用
Oct 08 #Javascript
有效的捕获JavaScript焦点的方法小结
Oct 08 #Javascript
Javascript isArray 数组类型检测函数
Oct 08 #Javascript
JavaScript 监听textarea中按键事件
Oct 08 #Javascript
jquery 最简单的属性菜单
Oct 08 #Javascript
Javascript 日期处理之时区问题
Oct 08 #Javascript
You might like
PHP根据IP地址获取所在城市具体实现
2013/11/27 PHP
php简单复制文件的方法
2016/05/09 PHP
php页面跳转session cookie丢失导致不能登录等问题的解决方法
2016/12/12 PHP
php+redis实现消息队列功能示例
2019/09/19 PHP
神奇的代码 通杀各种网站-可随意修改复制页面内容
2008/07/17 Javascript
jQuery之字体大小的设置方法
2014/02/27 Javascript
JavaScript操作Oracle数据库示例
2015/03/06 Javascript
JQuery PHP图片在线裁剪实例
2020/07/27 Javascript
js数字舍入误差以及解决方法(必看篇)
2017/02/28 Javascript
jQuery实现可兼容IE6的遮罩功能详解
2017/09/19 jQuery
es6基础学习之解构赋值
2018/12/10 Javascript
vue-cli构建vue项目的步骤详解
2019/01/27 Javascript
vue实现分环境打包步骤(给不同的环境配置相对应的打包命令)
2019/06/04 Javascript
Jquery+javascript实现支付网页数字键盘
2020/12/21 jQuery
JavaScript 判断浏览器是否是IE
2021/02/19 Javascript
[03:17]2016完美“圣”典风云人物:冷冷专访
2016/12/08 DOTA
Python如何获取系统iops示例代码
2016/09/06 Python
关于Django外键赋值问题详解
2017/08/13 Python
Python实现的读取电脑硬件信息功能示例
2018/05/30 Python
详解基于django实现的webssh简单例子
2018/07/17 Python
python reverse反转部分数组的实例
2018/12/13 Python
Python图像处理之颜色的定义与使用分析
2019/01/03 Python
对Python模块导入时全局变量__all__的作用详解
2019/01/11 Python
Python常用爬虫代码总结方便查询
2019/02/25 Python
python命令行参数用法实例分析
2019/06/25 Python
利用python实现周期财务统计可视化
2019/08/25 Python
Python 格式化输出_String Formatting_控制小数点位数的实例详解
2020/02/04 Python
详解Pytorch显存动态分配规律探索
2020/11/17 Python
养殖人员的创业计划书范文
2013/12/26 职场文书
经济管理专业自荐信
2013/12/30 职场文书
气象学专业个人求职信
2014/04/22 职场文书
2014年机关党委工作总结
2014/12/11 职场文书
2014年图书馆个人工作总结
2014/12/18 职场文书
2016年寒假社会实践活动总结
2015/03/27 职场文书
物业工程部主管岗位职责
2015/04/16 职场文书
Python闭包的定义和使用方法
2022/04/11 Python