`
wangemperor
  • 浏览: 38077 次
  • 性别: Icon_minigender_1
  • 来自: 济南
社区版块
存档分类
最新评论

js中用cssText设置css样式 (

 
阅读更多
如果网页中一个 id为“no”的标签,暂且当div标签来tell;
想要在js中设置这个div的css样式,很一般的做法是:
var obj = document.getElementByIdx_x_x('no');
obj.style.width = '400px';
obj.style.height = '300px';
如果要设置一堆又一堆的css样式呢,太麻烦了把、
一般情况下都会结合css来添加className或者改变className达到想要的效果,但是如果你create一个元素,难道还想这样简单点?那就要想别的办法了~
于是大家就写了一个又一个的函数,经典的两个是:
var obj = document.getElementByIdx_x_x('no');
function setStyle(obj, css) {
for(var attr in obj){
obj.style[attr] = css[attr];
}
}
setStyle(obj,{width:"400px",height:"300px"});

当然还有更简单的,cssText:
var obj = document.getElementByIdx_x_x('no');
obj.style.cssText = "width:400px; height:300px;";
当然这种方法对于create的元素初始化css样式来说很简单很方便。
分享到:
评论

相关推荐

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

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

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

    下面小编就为大家带来一篇js中用cssText设置css样式的简单方法。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧

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

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

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

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

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

    需要注意的是: 注意大小写: javascript对大小写十分敏感,className不能够把“N”写成“n”,cssText也不能够把“T”写成“t”,否则无法实现效果。 调用方法: 如果改变className,则事先在样式表中申明类,但...

    js setattribute批量设置css样式

    IE中则必须使用style.cssText var dom=document.getElementById(“name”); dom1.style.cssText = “width:10px;height:10px;border:solid 1px red;”; 补充一下,目前style.cssText类似innerHTML了,已经成为一个

    原生js更改css样式的两种方式

    2. 先在CSS样式表中对特定的类如“active类”设置样式(这里的active类是假定的,暂时不存在),然后再在javascript代码中通过node.classname=”active”使得CSS样式表中对active类的样式设置附加到该node节点上来。...

    用cssText批量修改样式

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

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

    我们用js书写css样式通常会用下面的两种方式: 一般情况下我们用js设置元素对象的样式会使用这样的形式: 代码如下:var element= document.getElementById(”id”); element.style.width=”20px”; element.style....

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

    事实证明cssText在多数浏览器中性能较高</title> </head> <body> <input type=”button” value=”测试1″ onclick=”test1()”/> || <input type=”button” value=”测试2″ onclick=...

    JavaScript修改css样式style

    需要注意的是: 注意大小写: javascript对大小写十分敏感,className不能够把“N”写成“n”,cssText也不能够把“T”写成“t”,否则无法实现效果。 调用方法: 如果改变className,则事先在样式表中申明类,但...

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

    给一个HTML元素设置css属性,如 代码如下: var head= document.getElementById(“head”); head.style.width = “200px”; head.style.height = “70px”; head.style.display = “block”; 这样写太罗嗦了,为了...

    js改变css样式的三种方法推荐

    第一种:用cssText div.style.cssText=’width:250px;height:250px;border:1px red solid;’; 第二种:用setProperty() div.style.setProperty(‘width’,’250px’); div.style.setProperty(‘height’,’250px’);...

    JavaScript中的style.cssText使用教程

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

    用JavaScript动态建立或增加CSS样式表的实现方法

    // 这个注释只在当前JS中帮助理解,并不会写入CSS中 'width:300px;height:150px}' + '.类名{……}' + '#ID们{……}' ;  //完活。我喜欢分号这样写,和指令书写的起始位置对齐比较好一点,尤其是后面有其它语句...

    Javascript改变CSS样式(局部和全局)

    一、局部改变样式 有三种方法:直接改变样式、改变className和改变cssText 改变className: document.getElementById(‘obj’).className=”…” 改变cssText:document.getElementById(‘obj’).style.cssText=”...

    JS修改css样式style浅谈

    需要注意的是: 注意大小写: javascript对大小写十分敏感,className不能够把“N”写成“n”,cssText也不能够把“T”写成“t”,否则无法实现效果。 调用方法: 如果改变className,则事先在样式表中申明类,但...

Global site tag (gtag.js) - Google Analytics