给一个HTML元素设置css属性
  • var head= document.getElementById("head");
    head.style.width = "200px";
    head.style.height = "70px";
    head.style.display = "block";
 
 
使用cssText属性
  • var head= document.getElementById("head");
    head.style.cssText="width:200px;height:70px;display:bolck";
 
 

  cssText很快捷且所有浏览器都支持。此外当批量操作样式时,cssText只需一次reflow,提高了页面渲染性能。

  但cssText也有个缺点,会覆盖之前的样式。
 
 
  使用cssText时应该采用叠加的方式以保留原有的样式
  • function setStyle(el, strCss){
        var sty = el.style;
        sty.cssText = sty.cssText + strCss;
    }
 
 
  使用该方法在IE9/Firefox/Safari/Chrome/Opera中没什么问题,但由于 IE6/7/8中cssText返回值少了分号 会让你失望。因此对IE6/7/8还需单独处理下,如果cssText返回值没";"则补上
  • function setStyle(el, strCss){
        function endsWith(str, suffix) {
            var l = str.length - suffix.length;
            return l >= 0 && str.indexOf(suffix, l) == l;
        }
        var sty = el.style,
        cssText = sty.cssText;
        if(!endsWith(cssText, ';')){
            cssText += ';';
        }
        sty.cssText = cssText + strCss;
    }
 
 
 
 
 

CSSText属性批量修改样式的更多相关文章

  1. 活动目录对象属性批量修改工具------ADModify

    最近下载了一个可以修改活动目录用户.组.联系人等活动目录对象属性的工具,试用了一下,发现还是蛮好用的,并且还可以修改对象的扩展属性,如:在活动目录中安装了Exchange 2003,Exchange ...

  2. Javascript原生之用cssText批量修改样式

    一般情况下我们用js设置元素对象的样式会使用这样的形式: var element= document.getElementById(“id”);element.style.width=”20px”;e ...

  3. cssText批量修改样式

    cssText所有浏览器都支持. cssText 的使用 obj.style.cssText = " width:200px;position:absolute;left:100px;&qu ...

  4. 用cssText批量修改样式

    一般情况下我们用js设置元素对象的样式会使用这样的形式: var element= document.getElementById(“id”);element.style.width=”20px”;e ...

  5. orcad元件属性批量修改(通过excel表格)

    本文适合于没有使用CIS的情况下,提高元件属性修改的效率和BOM生成. 第一步:编号 首先给元件编好号: 如果是沿用旧工程,用这个编号.如果是创建的新工程,使用第二项,强制从头开始编号.因为编号与PC ...

  6. js中cssText批量修改元素样式

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

  7. 脚本工具(获取某个文件夹下的所有图片属性批量生成css样式)

    问题描述: 由于有一次工作原因,就是将某个文件夹下的所有图片,通过CSS描述他们的属性,用的时候就可以直接引用.但是我觉得那个文件夹下的图片太多,而且CSS文件的格式又有一定的规律,所有想通过脚本来生 ...

  8. jQuery修改class属性和CSS样式

    jQuery修改class属性和CSS样式 class属性修改 类属性即class属性,规定类名. 用类选择器规定样式的时候,需要为元素指定类名,即class属性的值. 注意每个HTML元素只有一个c ...

  9. 关于Entity Framework采用DB First模式创建后的实体批量修改相关属性技巧

    Entity Framework采用DB First模式创建实体是比较容易与方便的,修改已创建的实体在个数不多的情况下也是没问题的,但如果已创建的实体比较多,比如10个实体以上,涉及修改的地方比较多的 ...

随机推荐

  1. Java.lang.String 乱码反编译

    这个有个前提就是要知道错误的编码和应该转换的正确的编码 比如 gbk = >utf-8 可以 System.out.println("具体的乱码".getBytes(&quo ...

  2. iOS NSTimer使用详解 开启、关闭、移除

    定时器定时器详解ios定时器关闭定时器NSTimer 一,要使用一个定时器首先要定义一个定时器: @property (strong, nonatomic) NSTimer *myTimer;//定时 ...

  3. Base64编码及其作用

    Base64编码的作用:由于某些系统中只能使用ASCII字符.Base64就是用来将非ASCII字符的数据转换成ASCII字符的一种方法.它使用下面表中所使用的字符与编码. 而且base64特别适合在 ...

  4. C++中typename和class的区别

    C++中typename和class的区别 在c++Template中很多地方都用到了typename与class这两个关键字,而且好像可以替换,是不是这两个关键字完全一样呢? 相信学习C++的人对c ...

  5. zend studio导入svn项目后不能代码提示的解决

    把项目下.project的文件内容改成如下: <?xml version="1.0" encoding="UTF-8"?><projectDe ...

  6. Tomcat服务器重启失败:The server may already be running in another process, or a system process may be using the port.

    在控制台重启Tomcat服务器,报错如下: 原因分析: You've another instance of Tomcat already running. You can confirm this ...

  7. DDGSpring2016 Demos

    I followed the course http://brickisland.net/DDGSpring2016/, and here is the screenshot of my coding ...

  8. Install Houdini 12.5 x64 in CentOS 7

    Thanks for Must(QQ ID)'s big help for installing Houdini in CentOS7. - download HOUDINI_FX_V12.5.371 ...

  9. linux新增用户并增加sudo权限

    创建用户.设置密码: useradd testuser 创建用户testuserpasswd testuser 给已创建的用户testuser设置密码 增加sudo权限: #vi /etc/sudoe ...

  10. 开始python学习了

    今晚折腾了半天,终于在mac上把python开发ide搞好了. 本来是打算使用eclipse+pydev的,结果在eclipse marketplace里面搜索到得pydev插件无法安装,一直是提示网 ...