在js设置css样式做法

var obj = document.getElementById('div');
obj.style.width = '100px';
obj.style.height = '100px';

但是上面的写法如果样式多了就会造成写了一堆的js于是有了封装函数的写法

var obj = document.getElementById('div');
function setStyle(obj, css) {
for(var attr in obj){
obj.style[attr] = css[attr];
}
}
setStyle(obj,{width:"100px",height:"100px"});

更简单的写法

var obj = document.getElementById('div');
obj.style.cssText = "width:100px; height:100px;";

js设置css样式.的更多相关文章

  1. JS设置CSS样式的几种方式

    用JS来动态设置CSS样式,常见的有以下几种 1. 直接设置style的属性  某些情况用这个设置 !important值无效 如果属性有'-'号,就写成驼峰的形式(如textAlign)  如果想保 ...

  2. JS设置CSS样式的几种方式【转】

    用JS来动态设置CSS样式,常见的有以下几种 1. 直接设置style的属性  某些情况用这个设置 !important值无效 如果属性有'-'号,就写成驼峰的形式(如textAlign)  如果想保 ...

  3. JS设置CSS样式的集中方式

    1. 直接设置style的属性  某些情况用这个设置 !important值无效 如果属性有'-'号,就写成驼峰的形式(如textAlign)  如果想保留 - 号,就中括号的形式  element. ...

  4. 3.通过js代码设置css样式

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. 5、通过js代码设置css样式

    1.页面 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3 ...

  6. cssText设置css样式

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

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

    下面我给大家介绍的是原生js更改CSS样式的两种方式: 1通过在javascript代码中的node.style.cssText="css表达式1:css表达式2:css表达式3  &quo ...

  8. react学习(四)之设置 css样式 篇

    react中设置css样式 方法一: 行内样式:使用{{  }},与正常jsx中插入js代码不一样,这里需要两个括号. <div style={ { float: 'right',} }> ...

  9. 【javascript】原生js更改css样式的两种方式

    下面我给大家介绍的是原生js更改CSS样式的两种方式: 1通过在javascript代码中的node.style.cssText="css表达式1:css表达式2:css表达式3  &quo ...

随机推荐

  1. JavaScript学习笔记4之 ByClass&json

    一.通过class获取标签 var out=document.getElementsByClassName(‘out’);IE 6 7 8 不支持 getElementsName 是否有办法既能通过c ...

  2. iOS 字符串的宽度和高度自适应

    //获取字符串的宽度 -(float)widthForString:(NSString *)value fontSize:(float)fontSize andHeight:(float)height ...

  3. Android开发案例 - 淘宝商品详情

    所有电商APP的商品详情页面几乎都是和淘宝的一模一样(见下图): 采用上下分页的模式 商品基本参数 & 选购参数在上页展示 商品图文详情等其他信息放在下页展示 知识要点 垂直方向的ViewPa ...

  4. Atitit.工作流 与 规则引擎

    Atitit.工作流 与 规则引擎 1.1. 应用来说,通常分为三部分:界面.业务逻辑和存储1 1.2. 自定义操作系列1 1.3. 自定义按钮系列2 1.1. 应用来说,通常分为三部分:界面.业务逻 ...

  5. monkey命令选项参考

    基本参数:     --help              打印帮助消息 -v  可以在命令行中出现多次,每次一个-V选项都会增加monkey向命令行打印输出的详细级别.默认的级别0只会打印启动信息. ...

  6. Linux 系统中的MySQL数据库默认区分大小写

    今天在开发中遇到这么个问题,将连接的数据库改为服务器上的时候(服务器是Linux系统的),程序跑起来后一直出错,总提示数据库的表找不到, 而打开数据库看该表明明是存在的,在我的印象中MySQL数据是不 ...

  7. CentOS(5.8/6.7)linux生产环境若干优化实战

    CentOS系统安装之后并不能立即投入生产环境使用,往往需要先经过我们运维人员的优化才行.在此讲解几点关于Linux系统安装后的基础优化操作.注意:本次优化都是基于CentOS(5.8/6.7). 下 ...

  8. POJ 2739. Sum of Consecutive Prime Numbers

    Sum of Consecutive Prime Numbers Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 20050 ...

  9. Linux多线程编程

    线程和进程的区别是: 进程是拷贝主进程的数据段和代码段的. 线程是和主进程公用一份数据段和代码段的. 线程一旦创建,就从指定的入口函数开始执行. 相关头文件: #include <pthread ...

  10. vs2013 打开vs2010 找不到此项目类型所基于的应用程序 MVC2 升级 MVC5 不能加载Web项目

    Upgrading an ASP.NET MVC 2 Project to ASP.NET MVC 3 Tools Update ASP.NET MVC 3 can be installed side ...