总结-DOM通用属性&DOM获取元素位置&事件绑定与移除&冒泡和标签的默认行为

DOM通用属性&DOM获取元素位置&事件绑定与移除&冒泡和标签的默认行为
	DOM对象的通用属性
		innerHTML
			获取/设置元素里的html内容。在设置元素的HTML内容的时候,会覆盖掉原来的内容。
		innerText
			获取/设置元素里面的文本内容
		 nodeName
			元素节点的 nodeName 与标签名相同 
			​ 属性节点的 nodeName 与属性名相同 
			​ 文本节点的 nodeName 始终是 #text 
			​ 文档节点的 nodeName 始终是 #document
		nodeValue
			元素节点的 nodeValue 是 undefined 或 null 
			​ 文本节点的 nodeValue 是文本本身
			​ 属性节点的 nodeValue 是属性值
		nodeType
			调用nodeType属性会得到一个数字,这个数字表示节点的类型
			 元素 1 
			​ 属性 2
			​ 文本 3
			​ 注释 8 
			​ 文档 9
	DOM获取元素的位置
		offsetLeft     元素在网页中水平坐标值 
		offsetTop     元素在网页中垂直坐标值
		offsetWidth   元素在页面中占据的宽度
		offsetHeight  元素在页面中占据的高度
		scrollLeft     滚动条在容器中水平滚动的距离,多用于浏览器的滚动条
		scrollTop     滚动条在容器中垂直滚动的距离,多用于浏览器的滚动条
	事件绑定与移除
		直接在HTML标签中添加,即使用onclick、onmouseover等HTML属性;
		DOM的方式添加,即通过dom方法获取节点,然后为其绑定事件;
			取消事件:节点.onclick=null;
		使用addEventListener或attachEvent(IE8及更低版本浏览器)
			元素节点.attachEvent(事件名, 事件处理函数);
				元素节点.dettachEvent(事件名 处理函数);
			元素节点.addEventListener(事件名, 事件处理函数);// 事件名不要带on
				元素节点.removeEventListener(事件名, 处理函数); //事件名不要带on
	事件对象相关属性和方法使用
		冒泡事件及阻止冒泡事件的发生
			实际开发中,有些时候就希望事件冒泡,可以不对其进行处理;有些时候不希望事件冒泡,那么就需要阻止事件冒泡。
		阻止冒泡
			evt.stopPropagation(); //evt指的是事件对象
				非IE
			window.event.cancelBubble = true;
				IE
		阻止标签的默认行为
			有些时候,点击了a标签或者submit按钮后不希望执行标签的默认行为,这时候就需要阻止默认行为。
		evt.preventDefault();
			非IE
		window.event.returnValue = false;
			IE
		return false;
			万能阻止:
				return flase;
				onclick="return false";
				onclick ="return confirm('你确定要删除吗');"返回值true和false

猜你喜欢

转载自blog.csdn.net/qq_39723600/article/details/83108270