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 相关文章推荐
ExtJS 学习专题(一) 如何应用ExtJS(附实例)
Mar 11 Javascript
纯js实现div内图片自适应大小(已测试,兼容火狐)
Jun 16 Javascript
javascript元素动态创建实现方法
May 13 Javascript
javascript插件开发的一些感想和心得
Feb 28 Javascript
关于jQuery EasyUI 中刷新Tab选项卡后一个页面变形的解决方法
Mar 02 Javascript
vue2 自定义动态组件所遇到的问题
Jun 08 Javascript
Javascript中Promise的四种常用方法总结
Jul 14 Javascript
js捆绑TypeScript声明文件的方法教程
Apr 13 Javascript
详解使用create-react-app添加css modules、sasss和antd
Jul 31 Javascript
JavaScript实现简单轮播图效果
Dec 01 Javascript
angular中两种表单的区别(响应式和模板驱动表单)
Dec 06 Javascript
微信小程序使用map组件实现获取定位城市天气或者指定城市天气数据功能
Jan 22 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
推荐文章系统(一)
2006/10/09 PHP
PHP6 mysql连接方式说明
2009/02/09 PHP
PHP中加密解密函数与DES加密解密实例
2014/10/17 PHP
php去除字符串中空字符的常用方法小结
2015/03/17 PHP
ThinkPHP模型详解
2015/07/27 PHP
解决FLASH需要点击激活的代码
2006/12/20 Javascript
silverlight线程与基于事件驱动javascript引擎(实现轨迹回放功能)
2011/08/09 Javascript
JS删除数组元素的函数介绍
2013/03/27 Javascript
jQuery的缓存机制浅析
2014/06/07 Javascript
jQuery+HTML5美女瀑布流布局实现方法
2015/09/21 Javascript
浅谈js中的延迟执行和定时执行
2016/05/31 Javascript
bootstrap weebox 支持ajax的模态弹出框
2017/02/23 Javascript
AngularJS页面传参的5种方式
2017/04/01 Javascript
js数组实现权重概率分配
2017/09/12 Javascript
jQuery实现切换隐藏与显示同时切换图标功能
2017/10/29 jQuery
使用JavaScript生成罗马字符的实例代码
2018/06/08 Javascript
Vue-Quill-Editor富文本编辑器的使用教程
2018/09/21 Javascript
layer ui 导入文件之前传入数据的实例
2019/09/23 Javascript
vue实现公共方法抽离
2020/07/31 Javascript
React 条件渲染最佳实践小结(7种)
2020/09/27 Javascript
Python利用IPython提高开发效率
2016/08/10 Python
python 类详解及简单实例
2017/03/24 Python
TensorFlow 模型载入方法汇总(小结)
2018/06/19 Python
python调用pyaudio使用麦克风录制wav声音文件的教程
2019/06/26 Python
python同步windows和linux文件
2019/08/29 Python
如何用PyPy让你的Python代码运行得更快
2020/12/02 Python
python 基于pygame实现俄罗斯方块
2021/03/02 Python
阿根廷网上配眼镜:SmartBuyGlasses阿根廷
2016/08/19 全球购物
自荐书模板
2013/12/15 职场文书
小区门卫值班制度
2014/01/24 职场文书
应届毕业生个人求职信范文
2014/01/29 职场文书
公司采购主管岗位职责
2014/06/17 职场文书
国家机关领导干部民主生活会对照检查材料思想汇报
2014/09/17 职场文书
2014年党委工作总结
2014/11/22 职场文书
Nginx配置文件详解以及优化建议指南
2021/09/15 Servers