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. C#控制台基础 函数的参数是接口 实现接口的类都可以作为参数,很好用

    镇场诗: 大梦谁觉,水月中建博客.百千磨难,才知世事无常. 今持佛语,技术无量愿学.愿尽所学,铸一良心博客.------------------------------------------ 1.代 ...

  2. ios获取摄像头与相册图片

    iOS的一些设备上都安装了摄像头.现在绝大多数都有了. 在编程中,我们是用相应的东西来进行照相,录像等功能.   一.UIImagePickerController类 UIImagePickerCon ...

  3. block 实现原理详解(一)

    对于大多数人来讲,block内部到底是怎样实现的呢?我们可以借助clang将其编译成为c++的代码,就可以看出,block到底是什么东西, 先来看这样一个问题, <!-- lang: cpp - ...

  4. HIP-HOP 漫画家 Skottie Young

     http://blog.sina.com.cn/s/blog_67e59b160100v9ib.html           以上是部分预览图! 下载地址: 29  MB=   127  张 yy语 ...

  5. 别名alias

    alias #查看已设置的别名 alias  别名='原命令' #暂时设定别名(重启失效):alias ls='ls --color=never' unalias  别名 #删除别名 设置别名永久生效 ...

  6. Codeforces Round #249 (Div. 2) C题,模拟画图 ----未解决!

    http://codeforces.com/contest/435/problem/C

  7. iOS 框架收集

    检测硬件设备信息 https://github.com/Shmoopi/iOS-System-Services

  8. NS_ASSUME_NONNULL_BEGIN,NS_ASSUME_NONNULL_END

    Nonnull区域设置(Audited Regions) 如果需要每个属性或每个方法都去指定nonnull和nullable,是一件非常繁琐的事.苹果为了减轻我们的工作量,专门提供了两个宏:NS_AS ...

  9. 2016-2017 ACM-ICPC, NEERC, Southern Subregional Contest (Online Mirror, ACM-ICPC Rules, Teams Preferred) 几道简单题的题解

    A. Toda 2 题意:给你n个人,每个人的分数是a[i],每次可以从两个人到五个人的使得分数减一,使得最终的分数相等: 思路:假设答案为m:每个人的分数与答案m的差值为d[i],sum为d[i]的 ...

  10. 细说 Request[]与Request.Params[]

    http://www.cnblogs.com/fish-li/archive/2011/12/06/2278463.html