关于获取、设置css样式封装的函数入门版
<html>
<head>
<meta charset="UTF-8">
<title>CSS样式的获取和设置:简单版</title>
<style type="text/css">
#div {
width: 100px;
height: 100px;
background: pink;
}
</style>
<script type="text/javascript">
//根据id获取元素
function $(id) {
return document.getElementById(id);
}
//获取样式
function getStyle(obj, attr) {
//哪个对象obj
//哪个属性attr
//兼容IE
if (obj.currentStyle) {
return obj.currentStyle[attr];
}
else {
//兼容谷歌 火狐
return getComputedStyle(obj, false)[attr];
}
} //获取或者设置CSS的属性
function css(obj, attr, value) {
//获取CSS的数值
if (arguments.length == 2) {
return getStyle(obj, attr);
}
//设置CSS的数值
if (arguments.length == 3) {
obj.style[attr] = value;
}
}
//调用CSS()方法，进行测试
window.onload = function() {
css($("div"), "width", “200px”);
}
// 最后可以把这写在一起，一个函数就搞定
function css(obj,attr,value){
var getStyle = obj.currentStyle ? obj.currentStyle[attr] : getComputedStyle(obj,false)[attr];
if(arguments.length === 2){
return getStyle; }else if(arguments.length === 3){
obj.style[attr] = value;
}
}
</script>
</head>
<body>
<div id="div"></div>
</body>
</html>
关于获取、设置css样式封装的函数入门版的更多相关文章
- （转载）记录函数 getStyle() 获取元素 CSS 样式
设置元素(element)的css属性值可以用element的style属性,例如要将element的背景色设置为黑色,可以这么做: element.style.backgroundColor = ' ...
- 获取元素计算后的css样式封装
获取元素计算后的css样式封装: function getCss(obj,attribute) { if(obj.currentStyle) { return obj.currentStyle[att ...
- 关于jquery中用函数来设置css样式
关于jquery中用函数来设置css样式 2016-12-21 23:27:55 1.jquery语法 $(selector).css(name,function(index,value)) name ...
- js设置css样式.
在js设置css样式做法 var obj = document.getElementById('div'); obj.style.width = '100px'; obj.style.height = ...
- JS设置CSS样式的几种方式
用JS来动态设置CSS样式,常见的有以下几种 1. 直接设置style的属性 某些情况用这个设置 !important值无效 如果属性有'-'号,就写成驼峰的形式(如textAlign) 如果想保 ...
- JS设置CSS样式的几种方式【转】
用JS来动态设置CSS样式,常见的有以下几种 1. 直接设置style的属性 某些情况用这个设置 !important值无效 如果属性有'-'号,就写成驼峰的形式(如textAlign) 如果想保 ...
- cssText设置css样式
js中用cssText设置css样式 (2012-08-21 10:40:22) 转载▼ 标签: js 如果网页中一个 id为“no”的标签,暂且当div标签来tell:想要在js中设置这个div ...
- DOM设置css样式
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- 3.通过js代码设置css样式
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
随机推荐
- JavaScript的个人学习随手记（二）
JS HTML DOM 改变 HTML 输出流 JavaScript 能够创建动态的 HTML 内容: 今天的日期是: Sat Sep 24 2016 15:06:50 GMT+0800 (中国标准时 ...
- 在 CentOS7 上安装 MongoDB
在 CentOS7 上安装 MongoDB 1 通过 SecureCRT 连接至 CentOS7 服务器: 2 进入到 /usr/local/ 目录: cd /usr/local 3 在当前目录下创建 ...
- 如何查看Oracle客户端版本
在实际工作中,总会遇到一些需要查看.验证ORACLE客户端版本的问题,因为一台服务器可能装了多个Oracle客户端版本:也有可能你需要知道安装的版本是32位还是64位的.如何查看Oracle客户端(O ...
- Linux命令学习总结：cd命令
命令简介: 该命令用来切换当前目录.cd 是change directory 的缩写 命令语法: cd [-L|-P] [dir] 使用示例 1:切换到当前目录的上一级目录 1: [root@DB-S ...
- SQLite学习笔记(六)&&共享缓存
介绍 通常情况下,sqlite中每个连接都会一个独立的pager对象,pager对象中管理了该连接的缓存信息,通过pragma cache_size指令可以设置缓存大小,默认是2000个page,每个 ...
- JVM之GI收集器
Garbage-First,面向服务端的垃圾收集器. 并行与并发:充分利用多核环境减少停顿时间, 分代收集:不需要配合其它收集器 空间整合:整体上看属于标记整理算法,局部(region之间)数据复制算 ...
- 【转】Hive的insert操作
insert 语法格式为: 1. 基本的插入语法: insert overwrite table tablename [partition(partcol1=val1,partclo2=val2)] ...
- Forbidden You don't have permission to access / on this server PHP
在新安装的谷歌游览器里,打不了PHP网站了,错误显示: Forbidden You don't have permission to access / on this server. 原因还是配置权限 ...
- 使用 python 获取 Linux 的 IP 信息(通过 ifconfig 命令)
我们可以使用 python 代码通过调用 ifconfig 命令来获取 Linux 主机的 IP 相关信息,包括:网卡名称.MAC地址.IP地址等. 第一种实现方式: #!/usr/bin/pytho ...
- Laravel 数据库读写分离
config/database.php ... 'mysql' => [ 'driver' => 'mysql', 'host' => env('DB_HOST', 'localho ...