用cssText批量修改样式


Posted in Javascript onAugust 29, 2009
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="样式";
上面的代码我们可以修改成:感谢sliuqin的在留言中的斧正
element.style.cssText("width:20px;height:20px;border:solid 1px red;")
下面是是正确的
element.style.cssText="width:20px;height:20px;border:solid 1px red;";

这样就可以尽量避免页面reflow,提高页面性能。
Javascript 相关文章推荐
javascript之dhDataGrid Ver2.0.0代码
Jul 01 Javascript
jQuery学习笔记之DOM对象和jQuery对象
Dec 22 Javascript
js jquery获取随机生成id的服务器控件的三种方法
Jul 11 Javascript
jquery中交替点击事件的实现代码
Feb 14 Javascript
模仿password输入框的实现代码
Jun 07 Javascript
jQuery Validate插件实现表单验证
Aug 19 Javascript
利用JavaScript实现拖拽改变元素大小
Dec 14 Javascript
Angular.js实现注册系统的实例详解
Dec 18 Javascript
浅谈Node框架接入ELK实践总结
Feb 22 Javascript
vue限制输入框只能输入8位整数和2位小数的代码
Nov 06 Javascript
vue实现的多页面项目如何优化打包的步骤详解
Jul 19 Javascript
vue中el-input绑定键盘按键(按键修饰符)
Jul 22 Javascript
javascript appendChild,innerHTML,join性能比较代码
Aug 29 #Javascript
IE 条件注释详解总结(附实例代码)
Aug 29 #Javascript
基于jQuery的ajax功能实现web service的json转化
Aug 29 #Javascript
用户注册常用javascript代码
Aug 29 #Javascript
csdn 博客中实现运行代码功能实现
Aug 29 #Javascript
js 分栏效果实现代码
Aug 29 #Javascript
javascript 简练的几个函数
Aug 29 #Javascript
You might like
PHP+FLASH实现上传文件进度条相关文件 下载
2007/07/21 PHP
关于访问控制的一首PHP面试题(对属性或方法的访问控制)
2012/09/13 PHP
PHP实现JS中escape与unescape的方法
2016/07/11 PHP
thinkPHP微信分享接口JSSDK用法实例
2017/07/07 PHP
javascript比较文档位置
2008/04/08 Javascript
javascript实现当前页导航激活的方法
2015/02/27 Javascript
JavaScript让网页出现渐隐渐显背景颜色的方法
2015/04/21 Javascript
JavaScript中this详解
2015/09/01 Javascript
JavaScript中的return语句简单介绍
2015/12/07 Javascript
AngularJS 输入验证详解及实例代码
2016/07/28 Javascript
关于微信中a链接无法跳转问题
2016/08/02 Javascript
JS中作用域和变量提升(hoisting)的深入理解
2016/10/31 Javascript
JS实现本地存储信息的方法(基于localStorage与userData)
2017/02/18 Javascript
vue2.0 路由不显示router-view的解决方法
2018/03/06 Javascript
angular2 NgModel模块的具体使用方法
2019/04/10 Javascript
VUE的history模式下除了index外其他路由404报错解决办法
2019/08/21 Javascript
Vue引入Stylus知识点总结
2020/01/16 Javascript
在 Vue 中使用 JSX 及使用它的原因浅析
2020/02/10 Javascript
小程序跳转到的H5页面再跳转回跳小程序的方法
2020/03/06 Javascript
nuxt 页面路由配置,主页轮播组件开发操作
2020/11/05 Javascript
浅谈Pycharm调用同级目录下的py脚本bug
2018/12/03 Python
Python基本语法之运算符功能与用法详解
2019/10/22 Python
python中的逆序遍历实例
2019/12/25 Python
python如何判断IP地址合法性
2020/04/05 Python
Python绘制全球疫情变化地图的实例代码
2020/04/20 Python
HTML5里的placeholder属性使用实例和美化显示效果的方法
2014/04/23 HTML / CSS
党组织公开承诺书
2014/03/29 职场文书
小学二年级学生评语
2014/04/21 职场文书
2015年度物业公司工作总结
2015/04/27 职场文书
2015年城市管理工作总结
2015/05/23 职场文书
2016关于军训的心得体会
2016/01/11 职场文书
文明和谐家庭事迹材料(2016精选版)
2016/02/29 职场文书
导游词之峨眉乐山/兵马俑/北京故宫御花园
2019/09/03 职场文书
JavaScript数组 几个常用方法总结
2021/11/11 Javascript
Kubernetes控制节点的部署
2022/04/01 Servers
关于pytest结合csv模块实现csv格式的数据驱动问题
2022/05/30 Python