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 ...
随机推荐
- python之实现缓存环
看了CodeBokk 第二版通过python实现缓存环,吸收之后记录下,方便以后查阅. 任务: 定义一个固定尺寸的缓存,当它填满的时候,新加入的元素会覆盖第一个(最老的)元素.这种数据结构在存储日志和 ...
- bat脚本-set(setlocal enabledelayedexpansion) 学习
设置本地为延迟扩展.其实也就是:延迟变量,全称延迟环境变量扩展. 事件一: @echo off set a=4 set a=5&echo %a% pause 解说:为什么是4而不是5呢?在ec ...
- 自己封装的tc
封装弹窗 html <head> <script src="jquery.js"></script> <script src=" ...
- Java 多线程 笔记 转自http://www.cnblogs.com/lwbqqyumidi/p/3804883.html
多线程作为Java中很重要的一个知识点, 一.线程的生命周期及五种基本状态 关于Java中线程的生命周期,首先看一下下面这张较为经典的图: 上图中基本上囊括了Java中多线程各重要知识点.掌握了上图中 ...
- Hadoop优先级调度
当同时在集群中运行多个作业时,默认情况下,Hadoop将提交的作业放入一个FIFO,一个作业结束后,Hadoop就启动下一个作业. 当一个运行时间长但是优先级较低的作业先于运行时间短而优先级较高的作业 ...
- MFC多线程各种线程用法 .
http://blog.csdn.net/qq61394323/article/details/9328301 一.问题的提出 编写一个耗时的单线程程序: 新建一个基于对话框的应用程序SingleTh ...
- C++之指针例题解析
看了挺长一段时间的C了,基本上是把基础语法过关了,偶然遇见一个C++的面试题,分析一下,作为一段时间的打卡. 代码在编译器里边打一下, #include <iostream> using ...
- nyoj587 hdu1045 简单深搜
#include<iostream> #include<cstdio> #include<queue> #include<vector> #includ ...
- redis写shell与ssh免密码登陆
redis-cli参数:-h :指定要连接的主机IP或域名-p :指定连接的端口-a :指定密码-r :执行指定的命令-n :数据库名-x :将最后一个参数输出为value redis写shell- ...
- [转] Gvim for windows中块选择的方法
在gvim(windows版)中,块选择的快捷键不是<Ctrl-v>,此快捷键为粘贴. 一般的选择模式为:v(小写),此时会显示:可视. 行选择模式为:V(大写),此时会显示:可视-行. ...