`
鹤惊昆仑
  • 浏览: 230689 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

批量修改样式--cssText与setAttribute("style","xxx")

    博客分类:
  • CSS
阅读更多
批量修改样式目的是尽量避免页面reflow,提高性能。
firefox等可以使用
dom.setAttribute("style","width:10px;height:10px;border:solid 1px red;")

IE中则必须使用style.cssText
dom1.style.cssText = "width:10px;height:10px;border:solid 1px red;";


参考:http://www.quirksmode.org/bugreports/archives/2005/03/setAttribute_does_not_work_in_IE_when_used_with_th.html

补充一下,目前style.cssText类似innerHTML了,已经成为一个web开发的事实标准。因此测试显示firefox浏览器也支持这种方式。
分享到:
评论

相关推荐

    js中巧用cssText属性批量操作样式.docx

    本文将详细介绍如何利用`cssText`属性来批量操作样式,并探讨其优点与局限性。 #### 什么是cssText属性 `cssText`是`CSSStyleDeclaration`接口的一个只读属性,它表示CSS声明块的文本表示形式。可以通过修改这个...

    用cssText批量修改样式

    代码如下: var element= document.getElementById(“id”);... js中有一个cssText的方法: 语法为:obj.style.cssText=”样式”; 上面的代码我们可以修改成:感谢sliuqin的在留言中的斧正 element.styl

    js setattribute批量设置css样式

    `style.cssText` 直接修改元素的内联样式,其语法与`setAttribute`相似: ```javascript var dom = document.getElementById("name"); dom.style.cssText = "width:10px;height:10px;border:solid 1px red;"; ``` ...

    JavaScript修改css样式style动态改变元素样式

    一、局部改变样式 分为改变直接样式,改变className和改变cssText三种。需要注意的是: 注意大小写: javascript对大小写十分敏感,className不能够把“N”写成“n”,cssText也不能够把“T”写成“t”,否则无法...

    JavaScript中的style.cssText使用教程

    很多人用过 style.color、style.display 等直接设置元素的样式属性,但是 style.cssText 用过的人就不多了。 cssText 本质是什么? cssText 的本质就是设置 HTML 元素的 style 属性值。 cssText 怎么用? 代码如下:...

    CSS text-shadow,box-shadow,border-radius属性

    因此,设计者应该根据实际设计需求,适度运用这些样式效果,同时考虑到网站的访问者和网站所承载的内容。适当地运用这些CSS3属性,可以使得网页在视觉上更具吸引力,并为用户提供更为丰富的交互体验。

    js中用事实证明cssText性能高的问题.docx

    本文通过一个实际的测试案例探讨了使用`cssText`属性与单独设置样式属性之间的性能差异。 首先,我们要理解`cssText`属性。在JavaScript中,`element.style.cssText`是一个字符串,它允许我们一次性设置或获取元素...

    前端开源库-made-style-parser

    《前端开源库-made-style-parser:探索与应用》 在当今的Web开发领域,前端开源库扮演着至关重要的角色,它们提供了丰富的功能,极大地提升了开发效率。"made-style-parser"便是这样一款专注于样式分析的前端开源库...

    js中用cssText设置css样式的简单方法.docx

    但需要注意的是,`cssText`会覆盖之前设置的所有内联样式,如果只想添加或修改个别样式,可能需要先备份原有的`cssText`,然后在新的样式字符串中合并。 此外,使用`cssText`时,要确保CSS规则的语法正确,包括属性...

    js中巧用cssText属性批量操作样式

    在JavaScript中操作CSS样式是前端开发的基础技能之一,通常我们会使用元素的style属性来为单个元素添加或修改样式,例如: ```javascript var head = document.getElementById("head"); head.style.width = "200px";...

    js中用事实证明cssText性能高的问题

    本文通过一个简单的测试案例探讨了使用`cssText`属性批量操作样式相对于逐个设置样式属性的性能优势。 首先,我们要理解`cssText`属性的作用。在JavaScript中,每个DOM元素的`style`对象提供了直接修改内联样式的...

    如何用JavaScript实现动态修改CSS样式表_.docx

    JavaScript 是一种广泛用于网页和网络应用的编程语言,它允许我们与用户交互并操作网页的各个部分,包括修改页面的样式。在本文中,我们将深入探讨如何使用 JavaScript 动态修改 CSS 样式表,从而实现对网页外观的...

    js批量设置样式的三种方法不推荐使用with

    在Web开发中,JavaScript经常用于操作DOM元素,其中修改元素样式是常见的任务之一。当需要对多个DOM元素批量设置样式时,可以采用不同的方法。在这份资料中,我们主要介绍了三种方法来批量设置元素样式,并特别指出...

    ajax中的IE和火狐的区别

    - Firefox同样支持此方法,但在IE中还提供了另一种方式:通过`object.style.cssText`直接设置样式,例如`object.style.cssText = 'color:red;'`。 - **插入DOM元素**: 将新创建的元素添加到文档树中时,`document....

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

    3. **优先级问题**:`cssText`设置的是内联样式,其优先级高于内部样式表(`<style>`标签)和外部样式表(`.css`文件),但低于`!important`声明的样式。 为了优化性能,可以考虑以下策略: - **批量操作**:尽可能...

    javascript中setAttribute兼容性用法分析

    - 对于CSS样式,除了直接赋值给`style`属性外,还可以使用`style.cssText`来一次性设置多个样式,例如`element.style.cssText = "color: #00f; background-color: #fff;"`。 5. **兼容性解决方案**: - 为了确保...

Global site tag (gtag.js) - Google Analytics