document.getElementById("box").style.cssText += ";color:red;font-size:20px";

代码分析:使用“+=”是为了防止之前的样式被清除,css代码前多一个分号是为了兼容万恶的IE。

推荐使用jQuery中的$(selector).css({css_json_code}),而最优的方法是定义css类,直接添加类名去修改style。

或者自己封装一个全局函数。例如如下代码,但是为避免浏览器重复渲染对性能产生影响,不推荐。

function setStyle(obj,json){
for(var i in json)
{
obj.style[i]=json[i];
}
}
setStyle(obj,{color : 'red', display : 'block'});

js添加多个样式属性cssText的更多相关文章

  1. js中获取css样式属性值

    关于js中style,currentStyle和getComputedStyle几个注意的地方 (1)用js的style只能获取元素的内联样式,内部样式和外部样式使用style是获取不到的.针对css ...

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

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

  3. js 获取任意一个元素的任意一个样式属性的值

    //谷歌,火狐支持console.log(window.getComputedStyle(my$("dv"),null).left);//IE8支持console.log(my$( ...

  4. Vue.js的类Class 与属性 Style如何绑定

    Vue.js的类Class 与属性 Style如何绑定 一.总结 一句话总结:数据绑定一个常见需求是操作元素的 class 列表和它的内联样式.因为它们都是属性,我们可以用 v-bind 处理它们:我 ...

  5. 史上最全的CSS hack方式一览 jQuery 图片轮播的代码分离 JQuery中的动画 C#中Trim()、TrimStart()、TrimEnd()的用法 marquee 标签的使用详情 js鼠标事件 js添加遮罩层 页面上通过地址栏传值时出现乱码的两种解决方法 ref和out的区别在c#中 总结

    史上最全的CSS hack方式一览 2013年09月28日 15:57:08 阅读数:175473 做前端多年,虽然不是经常需要hack,但是我们经常会遇到各浏览器表现不一致的情况.基于此,某些情况我 ...

  6. jQuery源码06-jQuery = function(){};给JQ对象,添加一些方法和属性,extend : JQ的继承方法,jQuery.extend()

    /*! * Includes Sizzle.js 选择器,独立的库 * http://sizzlejs.com/ */ (function( window, undefined ) { //" ...

  7. yquery-操作样式属性

    前几天回家,参加了全国的成人高考,都说学历是找工作的敲门砖,其实一点都不假,尤其是现在的社会竞争力那么强,你不学就会被淘汰.像要过自己想要的生活,就必须努力学习,努力赚钱,买自己想买的,过自己想过的. ...

  8. css,js,jquery的载入方式和属性控制

    本文章主要总结了css,js,jQuery在编写程序时的载入方式,与属性控制方式html和css共同组成了一个最基础的网页,js为标签样式提供动态效果 一,css的载入方式与属性控制 1.1,css引 ...

  9. 原创:新手布局福音!微信小程序使用flex的一些基础样式属性

    来源:新手布局福音!微信小程序使用flex的一些基础样式属性 作者:Nazi   Flex布局相对于以前我们经常所用到的布局方式要好的很多,在做微信小程序的时候要既能符合微信小程序的文档开发要求,又能 ...

随机推荐

  1. .NET Framework 4.7 安装

    我们打开.NET Framework下载界面: https://www.microsoft.com/net/download/framework 这时你会发现,我们能下载的.NET Framework ...

  2. Tomcat access log配置

    在tomcat的access中打印出请求的情况可以帮助我们分析问题,通常比较关注的有访问IP.线程号.访问url.返回状态码.访问时间.持续时间. 在Spring boot中使用了内嵌的tomcat, ...

  3. angular 实现导航ng-click切换

    angular写的导航.自学angular已有一段时间. <!doctype html><html lang="en"><head> <m ...

  4. 事件的preventDefault方法

    事件有一个preventDefault()方法,该方法可以用来取消事件的默认行为.许多事件都有默认执行的关联行为.例如,如果用户在文本字段中键入一个字符,则默认行为就是在文本字段中显示该字符.由于可以 ...

  5. AspNetCore - MVC实战系列(一)

    本章开篇先简单介绍下最近两周自己利用业余时间做的一个图片收集网站,当然这个是靠用户自己上传来收集不是去抓某些个网站的图片,那样没意义,这里我取名为“爱留图”:该网站的简单介绍大家可以参考下上篇的内容爱 ...

  6. LinkCode 第k个排列

    http://www.lintcode.com/zh-cn/problem/permutation-sequence/# 原题 给定 n 和 k,求123..n组成的排列中的第 k 个排列. 注意事项 ...

  7. poj1182食物链,经典带权并查集

    动物王国中有三类动物A,B,C,这三类动物的食物链构成了有趣的环形.A吃B, B吃C,C吃A. 现有N个动物,以1-N编号.每个动物都是A,B,C中的一种,但是我们并不知道它到底是哪一种. 有人用两种 ...

  8. Mqtt服务器搭建

    .bg { background: #99CC99 } Mqtt服务器搭建 测试环境:CentOS64位 1.安装基础软件 yum install gcc-c++ yum install cmake ...

  9. BM算法详解

    http://www-igm.univ-mlv.fr/~lecroq/string/node14.html http://www.cs.utexas.edu/users/moore/publicati ...

  10. 【原创】JQWidgets-TreeGrid 2、初探源码

    已知JQWidgets的TreeGrid组件依赖于jqxcore.js.jqxtreegrid.js,实际上它还依赖于jqxdatatable.js.我们先通过一个例子,来探索本次的话题. 需求: 图 ...