DOM中的元素基本操作

DOM:(document object model)文档对象模型.主要用来操作页面中的元素,标签.

获取元素的几种方法

			1.1通过类名:        	 document.getElementByClassName()
			1.2.通过标签:       	 document.getElementsByTagName()		
			1.3.通过Id:           	 document.getElementById()
			1.4.通过类选择器:     document,querySelector()		只能获取第一个选择器
										    document.querySelectorAll();		获得所有的选择器
			1.5 通过节点来获取元素:
						ele.parentNode	获取父节点		;	ele.children		获取所有子元素
						ele.childNodes  获取所有子节点
						第一个子元素  ele.children[0] 		最后一个子元素 ele.children[children.leng-1]
						下一个节点  ele.nextSibling
						下一个元素节点	ele.nextElementSibling
						上一个节点	ele.previousSibling		
						上一个元素节点	ele.previousElementSibling

2.操作元素属性:

	  2.1 操作自定义属性:
		 		2.11	element.setAttribute(key,value);	设置自定义属性
					element.getAttribute(key)				获取自定义属性
					element.removeAtrribute(key)			移除自定义属性
				2.12 	H5推荐我们自定义属性写法
						以 data- 开头,系统自动解析维护生成dataset集合;通过 ele.dataset(属性名)来获取属性值 多个属性	名,则使用驼峰命名法来获取属性值.
		2.2  操作已有属性 
					2.21 element.style
					2.22  element.className
					2.23 标签之间的内容的获取
						ele.innerHTML(识别标签)跟ele.innerText (不识别标签)
					2.24  获取input元素内容
								input.value 获取表单的内容 input.type获取表单的类型  input.checked获取表单的选中状态

3.增添元素

		3.1 先创建元素  : 1.document.createElement(元素标签)	;
									2.	document.innerHTML
									3.	document.write	
				3.2  追加元素    两种方法  :
												    3.21 :  element.appendChild(目标元素)
													3.22  element. inserBefore(目标元素,参照元素)		
		3.1 克隆元素 : 
							3.11 需要克隆的元素.cloneNode() 括号里面可以传递参数 true/false,若传递true,则为深克隆,也就是,不仅拷贝目前元素的内容,还包括标签,传递false获取不传递元素,则仅拷贝标签.

4.删除元素

		## 4.1   parent.removeChild(子元素)		目标元素.remove()   //通俗理解就是自爆,谁要删除,谁调用