1.准确描述DOM、DOM Tree、Node、document根节点含义。 DOM:是一种帮助javascript管理，操控，控制HTML页面结构的规范。 BOM:是一种帮助javascript管理，操控，控制浏览器的规范 Tree:节点树，由节点构成的树状结构，domtree就是表示整个页面本身 Node:节点 Document:根节点，最顶级结构

2.准确描述Document根节点通过属性获取页面节点（至少5个） (1)document.body能够获取页面的body标签 (2)document.getElementsByTagName() (3)变量名.style.cssText="属性名：属性值；....." (4)变量名.style.color="red....." (5)document.querySelector

3.准确描述DOM中提供对Node的四个通用操作API，并能够具体写出实际案例 (1)向指定元素节点内追加子节点列： var a = document.creatElement("li");//创建一个新的标签 var newE.innerhTMl("html内容")；//赋值 a.appendChild(newE);//在最后一个子节点上添加一个信息的节点

(2)拷贝节点语法：node.cloneNoed()调用该方法的节点的一个副本如果参数为空或者false,则是浅拷贝，即只克隆复制节点本身，不克隆里面的节点。如果括号参数为TRUE,则是速度拷贝，会复制节点本身以及里面所有的子节点。 ul.appendChild(ul.children[0].cloneNode());//浅拷贝 ul.appdChild(ul.children[0].cloneNode(true));//深拷贝 (3)向指定元素节点内插入子节点 var ad = document.creatElement("li");//创建一个dom元素 node.setAttribute("class","from-group choice");//设置属性 var parent=document.getElementById("thisid");//选择父元素 parent.appdchild(node);//向父元素最后追加指定节点 ////////////////////////////////////////////////////////////////// $(selector).append(content);$ ("div.choice:last").append(content)//选择最后一个class=choice的li的追加 (4)从指定元素节点中删除子节点 li.removeChild(); 4.准确描述如何获取页面可视区域宽高尺寸 window.screen

5.准确描述DOM中提供对Node的选中API (1)getElement系列家族方法与querySelect系列家族方法（至少6个） getElementById getElementsByTagName getElementClassName querySelector quereySelect querySelectorAll (2)准确描述”NodeList节点列表”与”HTMLCollection节点集合”的区别 NodeList：是一个文档节点的集合，只能通过索引来获取，它不是一个数组有length属性

HTMLCollection：可以使用索引，有length属性，可以通过name ,id 来获取

6.准确描述如何获取Node的类名列表 (1)准确描述如何获取Node的类名列表 1:getElementById 2:getElementsByTagName 3:getElementClassName 4:hasChildNodes() 5:nodeName 6:nodetype=元素节点/属性节点/文本节点 7:nodeValue (2)准确描述如何向Node的类名列表中添加类名 document.getElementByid("div").classList.add("类名") div.classList.add("xxx"); (3)准确描述如何从Node的类名列表中删除类名 div.classList.remove(''); /////////////////////// div.toggle("")//存在移除它，否则添加它 div.classList.replace("a","b")//将a替换为b

/////////////////////////////////////////// //使用展开语法去添加或者移除多个类值 const newd = ="" ...."; div.classList.add(...cls); div.classList.remove(...cls);

7.准确描述DOM中对Node节点提供了哪些通用API (1)设置与修改元素的内容（至少两种、并说明区别） //获取页面的内容并修改,会解析 tempLi.innerhTMl="" //innertext获取标签间纯文本，不会解析标签 div.innertext="

hhhhhhhhhhhhh

" //outerHTML从外标签开始到内标签结束 div.outerHTML = "kkkkkkkkkkkkkk" ///// div.classList.replace("a","b")//将a替换为b (2)设置与修改元素的样式（至少两种、并说明区别） div.css.style.color="" div.style.csstext="" div.style.TextAlain= (3)设置与修改元素的属性方法一：

设置：aetattribute 语法：元素名。setAttribute('属性'，''属性值')；列： div.setAttribute('style','background-color:red;');//设置的是行内样式

获取：getAttribute('属性名')；语法：元素名。getAttribute('属性名')；列子： div.getArribute('属性名')；

删除一个属性：removeAttributte() 语法：元素名.removeAttrribute("")

注意： 1.只能操作行内样式 2.当设置的样式含有单位时则必须+单位 3.如果样式是js中的关键字则需要在样式前+css 4.如果样式由下划线连接则需要去掉下划线将后面的单词首字母变为大写

/////////////////////////// 方法二：直接通过元素节点的style对象修改语法：元素名.style.样式名列： div.style.height=100+'px'; div.style.color=''

清除样式：语法：元素名.style='' div.style=''/null

还有一个设置样式语法：元素.style.setproperty(); div.style.getPropert('height',10px);

获取样式值 div.style.grtproperValue('width');

清除样式： div.style.removeProperty(width);

(4)元素父节点相关API ①获取元素所有子节点 node.parentNode/node.parentElement ②获取元素第一个子节点 node.node.childNodes/nodeChildren ③获取元素最后一个子节点 node.previousSibling/previousElementSibing

详解javascript基础知识

hhhhhhhhhhhhh