cssText 的本质就是设置 HTML 元素的 style 属性值

cssText 的方便之处在于一次可以写很多属性,而且变更 CSS 样式不必变 JS 代码,只需变样式字符串。但它有个缺点,就是它会覆盖掉前面的属性。

例子:

<div id="d1">test</div>
<script type="text/javascript">
document.getElementById("d1").style.width="100px";
document.getElementById("d1").style.cssText = "color:red; font-size:13px;text-decoration:underline;";
alert(document.getElementById("d1").style.cssText);
</script>

上例中test的颜色为红色,字号13px;有下划线,但是宽度不是100px;因为被覆盖掉了

cssText用法

<div id="d1">test</div>
<script type="text/javascript">
var od1=document.getElementById('d1');
od1.style.color="#fff";
od1.style.backgroundColor="#c66";
od1.style.width="100px";
od1.style.fontSize="14px";
</script>

改写

<div id="d1">test</div>
<script type="text/javascript">
var od1=document.getElementById('d1');
od1.style.cssText="color:#fff;background-color:#c66;width:100px;font-size:14px;";
</script>

节省了代码。

但是在IE6、7、8下会有问题

cssText的更多相关文章

  1. JavaScript 学习笔记——cssText

    平常编写代码,更改一个元素样式的时候,自己都是用 obj.style.width = "200px"; obj.style.position = "absolute&qu ...

  2. 浅谈cssText

    给一个HTML元素设置css属性,如 var head= document.getElementById("head"); head.style.width = "200 ...

  3. CSSText属性批量修改样式

      给一个HTML元素设置css属性 var head= document.getElementById("head");head.style.width = "200p ...

  4. CSS之cssText

    更改元素样式 <div style="width:100px;height:100px;text-align:center;line-height:100px;"> T ...

  5. cssText在 IE6/7/8和chrome/Firefox/IE9+的不同

    一,结尾没有分号 <div style="font-size:14px;">test</div> <script type="text/ja ...

  6. 巧用cssText属性批量操作样式

    给一个HTML元素设置css属性,如 1 2 3 4 var head= document.getElementById("head"); head.style.width = & ...

  7. 用JS查看修改CSS样式(cssText,attribute('style'),currentStyle,getComputedStyle)

    CSS样式定义方法 大家都知道,在为HTML设置样式的时候,通常有三种方法:内联样式,内部样式表,外部样式表. 1.内联样式: 内联样式表就是在HTML元素中的行内直接添加style属性. <d ...

  8. cssText设置css样式

    js中用cssText设置css样式 (2012-08-21 10:40:22) 转载▼ 标签: js   如果网页中一个 id为“no”的标签,暂且当div标签来tell:想要在js中设置这个div ...

  9. 用cssText属性批量操作样式

    给一个HTML元素设置css属性,如 var head= document.getElementById("head"); head.style.width = "200 ...

随机推荐

  1. word2007

      word2007   word2007图标   word2007边框和底纹   word2007扫描图片   word2007剪贴画   word2007图片   word2007页面视图   w ...

  2. echo输出到stderr

    echo "Your error message here" >&2 This is a normal echo (which goes to stdout), ho ...

  3. 终止jQuery的$.ajax方法abort

    最近遇到,如果用户频繁点击ajax请求,有两个问题: 1,如果连续点击了5个ajax请求,前4个其实是无效的,趁早结束节省资源. 2,更严重的问题是:最后一个发送的请求,响应未必是最后一个,有可能造成 ...

  4. 表生成器@ TableGenerator

    将当前主键的值单独保存到一个数据库的表中,主键的值每次都是从指定的表中查询来获得,这种生成主键的方式也是很常用的.这种方法生成主键的策略可以适用于任何的数据库,不必担心不同数据库不兼容造成的问题. 使 ...

  5. 如何在PADS的封装中做非金属化孔

    在设置封装的pads stacks的页面里,diameter,drill,plated三个项目(盘外径60mil,孔30mil) diameter:60,drill:30,plated:checked ...

  6. Fiddler界面详解

    Statistics 页签 完整页签如下图: Statistics 页签显示当前用户选择的 Sessions 的汇总信息,包括:选择的 Sessions 总数.发送字节数.接收字节数.响应类型的汇总表 ...

  7. DB层面上的设计 分库分表 读写分离 集群化 负载均衡

    第1章  引言 随着互联网应用的广泛普及,海量数据的存储和访问成为了系统设计的瓶颈问题.对于一个大型的 互联网应用,每天几十亿的PV无疑对数据库造成了相当高的负载.对于系统的稳定性和扩展性造成了极大的 ...

  8. intanceof以及引出的__proto__和prototype

    instanceof运算代码 function instance_of(L, R) { //L 表示左表达式,R 表示右表达式 var O = R.prototype; // 取 R 的显示原型 L ...

  9. RARP

    ARP的工作原理如下:1. 首先,每台主机都会在自己的ARP缓冲区 (ARP Cache)中建立一个 ARP列表,以表示IP地址和MAC地址的对应关系.2. 当源主机需要将一个数据包要发送到目的主机时 ...

  10. opencv 61篇

    (一)--安装配置.第一个程序 标签: imagebuildincludeinputpathcmd 2011-10-21 16:16 41132人阅读 评论(50) 收藏 举报  分类: OpenCV ...