JS 之设置元素样式的改变,可以利用样式框架
如果已经将某个元素的样式设定好了,又想改变,可以利用样式框架:
function setStyle(obj,attr,value){
obj.style[attr]=value;//注意此处attr的写法,点用中括号代替
}
然后就可以调用该函数对样式进行改写了,但是这样的话,想改变多个运算样式的时候,需要调用多次这个函数,若不想多次调用函数,该怎么办呢?
这时可以利用json,
function setStyle(obj,json){
var attr='';
for(attr in json){
obj,style[attr]=json[attr];
}
}
window.onload=function(){
var oDiv=doucment.getElementsByTagName('div')[0];
setStyle(oDiv,{width:200px,height:200px,background:yellow});//注意大括号内用逗号分隔
}
JS 之设置元素样式的改变,可以利用样式框架的更多相关文章
- js中设置元素class的三种方法小结
一.el.setAttribute('class','abc'); 代码如下: .abc { background: red; } test div var div = document.getEl ...
- JS如何设置元素样式的方法示例
<div id="box"></div> <script> var box = document.getElementById("bo ...
- FineReport——JS二次开发(CSS改变控件样式)
FR提供一些选择器,可以改变部分控件的样式,那么对于如何书写自己的css: 可以自己写css文件导入,也可以在页面加载结束事件中添加JS方法来改变css样式. 以文本框为例: 书写css文件,保存至% ...
- 关于js单页面实现跳转原理以及利用angularjs框架路由实现单页面跳转
还记得我们刚开始学习html时使用的锚节点实现跳转吗? <a href="#target">我想跳转至目标位置</a> <p>第一条</p ...
- js动态设置padding-top遇到的坑
我想通过js动态设置元素padding-top的百分比值:以下几种都是无法设置成功的: // setAttribute设置padding-top并且转换为百分比 imageBox.setAttribu ...
- js学习进阶-元素获取及样式设置
var imgs = document.querySelectorAll("article img"); 获得article元素的直接或间接子孙的所有img元素, <arti ...
- 如何通过源生js获取一个元素的具体样式值 /* getCss:获取指定元素的具体样式的属性值 curElement:[dom对象] attr:[string] */
昨天的博客些的真的是惨不忍睹啊!!!但是我的人生宗旨就是将不要脸的精神进行到底,所以,今天我又来了.哈哈哈哈哈! 方法一:元素.style.属性名:(这个有局限性--只能获取行内样式的值,对于样式表或 ...
- jQuery使用之(二)设置元素的样式
css是页面不能分隔的部分,jQuery中也提供了一些css相关的实用的办法.前面章节中有使用过 addClass()为元素添加css样式风格.本节主要介绍jQuery如何设置页面的样式风格.包括添加 ...
- js设置元素不能编辑
js设置元素不能编辑 $("#startLocation").attr("readOnly",true); js设置元素可以编辑 $("#startL ...
随机推荐
- JS正则表达式之特殊符号
在正则表达式中,许多标点符号具有特殊含义,比较难记,现归纳备个份: 这些符号有:^ $ . * + - ? = ! : | \ / ( ) [ ] { } 1."[ ]"表示字符 ...
- PHP定义静态方法的原则
与实例逻辑无关 与类逻辑有关 静态类本质上跟纯函数没区别. 1.static方法是类中的一个成员方法,属于整个类,即使不用创建任何对象也可以直接调用! 2.静态方法效率上要比实例化高,静态方法的缺点是 ...
- git的一些疑难点
一 .git reset,git revert,git checkout的区别和联系 主要参考:http://www.cnblogs.com/houpeiyong/p/5890748.html git ...
- 开源的许可证GPL、LGPL、BSD、Apache 2.0的通俗解释
软件开发者要开源软件,不单单是开放源代码就可以了,选择一种许可证很重要,一个许可证之于软件就相当于价值观之于普通人,代表了这个软件的基本品性.一个错误的许可证选择可能会直接导致整个项目的失败. 各种开 ...
- 关于java集合排序
对于排序,java开发者并不陌生. 为避免以后遗忘,现在再次总结一下! 常见8大排序算法, 平时自己熟悉的只有几种种!冒泡,二分/折半.插入.快排等!现在一一讲解一下,这里只讲思想,暂时不做实现! 一 ...
- memcahced缓存特点
1.key-value数据结构 2.所有数据保存在内存中 3.可以分布式集群 4.处理并发的机制是libevent事件机制 5.当内容容量达到指定值后,就基于LRU(Least Recently Us ...
- Windows端口转发
1. PortTunnel 2. windows 自带的 netsh -----windows下也有一个小工具:portforward.exe,图形界面容易操作,个人平常使用可以,但是也没有办法实现与 ...
- Tiny6410之控制icache驱动
什么是cache: 基于程序访问的局限性,在主存和CPU通用寄存器之间设置了一类高速的.容量较小的存储器,把正在执行的指令地址附件的一部分指令或数据从主存调入这类存储器,供CPU 在一段时间内使 ...
- servlet就实现在线用户表
在学习servlet的过程中,学习了如何用servlet实现在线用户表. 只有服务器处于开机状态才会有在线用户表的存在,在服务器关机的情况下自然就不存在在线用户表的说法:所以,楼主认为在线用户表的信息 ...
- ionic中$ionicPopover和$ionicModal
Popover可点多个按钮弹出同一个浮动框但内容不一样.那想要在同一页面弹出不同的浮动框怎么办呢? 这事就用到了$ionicModal,他和$ionicPopover一样的用法. 请看图: html: ...