首页 > 其他 > 详细

Dom的增删查改以及常用事件

时间:2017-07-17 09:28:37      阅读:266      评论:0      收藏:0      [点我收藏+]

dom的增删查改
// 查
var _input = document.getElementById(‘_input‘);
var _div = document.getElementsByClassName(‘_div‘);
var _div2 = document.getElementsByTagName(‘div‘);
var _radio = document.getElementById(‘_radio‘);
// 改
input.value = ‘随便‘;
div.style.height = ‘100px‘;
div.style.width = ‘100px‘;
div.style.backgroundColor = ‘pink‘;
div.innerText = ‘随便‘;
div.innerHtml = ‘<strong>随便</strong>‘;
radio.checked = true;

// 增
var p = document.createElement(‘p‘);
p.id = ‘p1‘;
_div[0].appendChild(p);

// 删
_div[0].removeChild(p);

dom的事件
var div1 = document.getElementById(‘div1‘);
var input1 = document.getElementById(‘input1‘);
// 鼠标点击时触发的事件
div1.onclick = function(){
console.log(‘onclick‘);
};
// 鼠标在元素上触发的事件
div1.onmouseover = function(){
div1.style.backgroundColor = ‘green‘;
};
// 鼠标移出元素时触发的事件
div1.onmouseout = function(){
div1.style.backgroundColor = ‘blue‘;
}
// 获得焦点
input1.onfocus = function(){
console.log(‘onfocus‘);
};
// 失去焦点
input1.onblur = function(){
console.log(‘onblur‘);
}
//值被更改
input1.onchange = function(){
console.log(‘onchange‘);
}

Dom的增删查改以及常用事件

原文:http://www.cnblogs.com/lhl66/p/7192609.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!