类似于jquery的css()函数,js封装

CSS函数:css(oDiv , “width” , “200px ”)设置样式
css(oDiv , “width”)获取样式

JS:
Function css(){
    If(arguments.length==2){
        Return arguments[0].style[arguments[1]]; //获取样式
   }else{
        Arguments[0].style[arguments[1]] = arguments[2]; //设置样式
   }
}
或是
Function css(obj,name,vaule){
    If(arguments.length==2){
        Return obj.style[name]; //获取样式
    }else{
        obj.style[name] = vaule; //设置样式
    }
}

调用:
Window.onload= function(){
    Var oDiv = document.getElementById(“div1”);
   css(oDiv , “width” , “200px ”);
    css(oDiv , “background” , “blue ”);
}

but:

Obj.style: 只能操作行间样式
兼容IE和高版本chrome操作非行间样式:obj.currentStyle
兼容chrome,FF,IE9操作非行间样式:obj.getComputedStyle(oDiv , null )

If(oDIv .currentStyle){
oDiv.currentStyle.width = “”;
}else{
getComputedStyle(oDiv,false).width= “”;
}

js 操作css的更多相关文章

  1. JS操作css的float属性的特殊写法

    使用js操作css属性的写法是有一定的规律的: 1.对于没有中划线的css属性一般直接使用style.属性名即可. 如:obj.style.margin,obj.style.width,obj.sty ...

  2. js操作css样式,null和undefined的区别?

    1.js操作css的样式 div.style.width="100px"在div标签内我们添加了一个style属性,并设定了width值.这种写法会给标签带来大量的style属性, ...

  3. 11-13 js操作css样式

    1.Js操作css样式 Div.style.width=”100px”.在div标签内我们添加了一个style属性,并设定了width值.这种写法会给标签带来大量的style属性,跟实际项目是不符. ...

  4. js操作css样式、js的兼容问题

    一.js操作css样式 div . style . width="200px" 在div标签内我们添加了一个style属性,并设定width值.这种写法会给标签带来大量的style ...

  5. 通过JS操作CSS

    动态效果如图所示: 第一种实现方法: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " ...

  6. JS操作CSS随机改变网页背景

    今天有个朋友在weibo上问我可不可以用JS和CSS让页面每次刷新随机产生一张背景图,当然我的回答是可以的.具体可以这样做: 1.用JS定义一个图片数组,里面存放你想要随机展示的图片 1 2 3 4 ...

  7. JS操作CSS样式

    一.样式表(css) 使用样式表可以更好的显示WEB文档,也可以结合javascript从而实现很好的控制样式表. 样式(css)与内容(html): HTML是处理文档结构的,HTML可以实现如何把 ...

  8. JS操作css样式用法

    //html <div id="div1" style="background:red;"> 修改背景颜色 </div> <but ...

  9. js操作css变量

    原文:http://css-live.ru/articles/dostup-k-css-peremennym-i-ix-izmenenie-spomoshhyu-javascript.html :ro ...

随机推荐

  1. 「DevOps 转型与实践」沙龙回顾第一讲

    9 月 19 日,CODING 和中国 DevOps 社区联合举办的深圳第九届 Meetup 在腾讯大厦 2 楼多功能圆满结束.本次沙龙以 「DevOps 转型与实践」 为主题,4 位来自互联网.金融 ...

  2. A4988两相四线步进电机驱动模块使用经验

    1.A4988模块可以驱动两相四线步进电机,模块引脚及接线图如下: 2.步进电机引线如下: 3.引脚: ENABLE:低电平有效,用于打开和关闭场效应管的输出: RESET:低电平有效,芯片复位: S ...

  3. rs485转以太网转换器

    rs485转以太网转换器ZLAN5103 实现RS485转以太网(即485转网口)主要一个硬件转换器和一个软件驱动.硬件转换器分为两种:串口服务器(串口联网服务器.串口通信服务器).串口联网模块.RS ...

  4. Exists 和Not Exists使用

    描述:exists表示()内子查询语句返回结果不为空说明where条件成立就会执行主sql语句,如果为空就表示where条件不成立,sql语句就不会执行.not exists和exists相反,子查询 ...

  5. IE下文件上传, SCRIPT5: 拒绝访问 问题

    最近遇到一个比较奇葩的问题,某些ie浏览器在页面中上传文件时,无法上传.查看控制台报错: SCRIPT5: 拒绝访问. jquery-3.2.1.min.js, 行4 字符5725 .并且我的最新版I ...

  6. 数据查询语句:DQL(Data Query Language)

    一.基础查询 1.语法:select 查询列表 from 表名; 2.特点:1.通过select查询完的结果,是一个虚拟的表格,不是真实存在   2.查询列表可以是:字段.表达式.常量.函数等   3 ...

  7. k8s-命令创建service

    查看命令帮助 [root@master kubernetes]# kubectl create service -h Create a service using specified subcomma ...

  8. ansible使用playbook的简单例子(ansible2.9.7)

    一,ansible使用playbook的优点 1,用ansible执行一些简单的任务,使用ad-hoc命令就可以解决问题 如果执行复杂的功能,需要大量的操作,执行的ad-hoc命令会不够方便,这时我们 ...

  9. 【荐】JavaScript图片放大技术(放大镜)示例代码

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

  10. tensorflow 出现KeyError: 'tulips\\8689672277_b289909f97_n.jpg'报错

    在学习tensorflow基础教程-图像章节过程中,按照官网教程学习的时候出现了以下报错 一开始很迷茫,按着教程走怎么会这样呢 ,上网查资料也没找到找到,没办法,只好自己找原因,根据提示KeyErro ...