码迷,mamicode.com
首页 > 其他好文 > 详细

用dom操作样式和dom事件

时间:2016-04-22 00:59:24      阅读:119      评论:0      收藏:0      [点我收藏+]

标签:

 

1.样式表的操作
1.1获取样式表:
var cssRules = document.styleSheets[0].cssRules //DOM规范
document.styleSheets[0].rules //IE
1.2获取最终样式
var divEle = document.getElementById("divId");
var backgroundColor = divEle.currentStyle.backgroundColor; //IE
var backgroundColor = (document.defaultView.)getComputedStyle(divEle, null).backgroundColor; //DOM规范

2.DOM事件
eg1:
<button onclick="execute()">click</button>

function execute() {
console.info("执行js代码");
} //通过button的onclick属性
eg2:
<button id="btn">click</button>

var btnEle = document.getElementById("btn");
btnEle.onclick = function() {
console.info("执行js代码");
} //通过dom的onclick属性
3.事件流
3.1事件冒泡 从里到外
3.2事件捕获 从外到底
4.兼容性处理
var divEle = document.getElementById("div1");
if(document.addEventListener){
divEle.addEverntListener("click",函数名,ture/false);//dom2
} else if(document.attachEvent){
divEle.attachEvent("onclick",函数名);//IE
}
5..event对象
可以获取整个事件的所有信息
兼容性处理:
function(event) {
event = event || window.event;
}
6.鼠标事件
7.键盘事件
8.HTML事件

用dom操作样式和dom事件

标签:

原文地址:http://www.cnblogs.com/hejieng/p/5419526.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!