原生js大总结六
051、如何打印当前浏览器的版本等信息
navigator.userAgent
返回包含浏览器版本等信息的字符串 ,常用于判断浏览器版本及使用设备(PC或者移动端
052 、在浏览器地址栏输入www.baidu.com后按下回车键会发生什么
1.域名解析
把域名解析ip地址 DNS域名解析系统
2.把ip发送到网络供应商 去找那个对应的主机服务器
3.TCP的三次握手 建立连接
4.开始发送请求 取回入口文件index.html
5.开始解析入口文件,并且取回需要的资源sources
6.进行
053、window.onload与window.onscroll的区别
window.onload:当页面加载完成的时候
window.onscroll:当页面滚动的时候
054、请简述下关于DOM的增、删、查
增---------createElement
var oDiv = document.createElement('div');
document.body.appendChild(oDiv);//只有追加后,页面上才会出现
2、删---------removeChild
语法:fatherObj.removeChild(childrenObj)
参数解释:
a、fatherObj:要删除子元素的元素对象
b、childrenObj:要被删除的子元素对象
3、查---------六种
document.getElementById('');常用
document.getElementsByClassName('');(ie9+)常用
document.getElementsByTagName('');常用
document.getElementsByName('');不常用
document.querySelector(选择器)(IE8+)(IE8+)
根据选择器返回匹配到的第一个元素
document.querySelectorAll(选择器);(IE8+)常用
根据选择器返回匹配到的所有的元素
055、请简述下关于Dom节点的分类
childNodes:获取所有节点 包括文本节点
节点分为3种类型:
1、元素节点 <span></span>
2、文本节点 <span>xxx</span>
3、属性节点 <span id ='xxx'></span>
可以通过nodeType这个属性查看节点的类型
nodeType == 1 元素
nodeType == 2 属性
nodeType == 3 文本节点
056、获取非行间样式
function getStyle(obj,attr){
if(obj.currentStyle){
return obj.currentStyle[attr];
}else{
return getComputedStyle(obj,false)[attr];
}
}
057、如何获取、设置、删除自定义属性
元素.getAttribute(属性名);
元素.setAttribute(属性名,属性值);
元素.removeAttribute(属性名);
058、innerHTML、innerText和outerHTML、outerText的区别(了解一下 背会就行不需要抄写)
- innerHTML 设置或获取位于对象起始和结束标签内的 HTML
- outerHTML 设置或获取对象及其内容的 HTML 形式
- innerText 设置或获取位于对象起始和结束标签内的文本
- outerText 设置(包括标签)或获取(不包括标签)对象的文本
innerText和outerText在获取时是相同效果,但在设置时,innerText仅设置标签内的文本,而outerText设置包括标签在内的文本。
不同之处:
简单的说innerHTML和outerHTML、innerText与outerText的不同之处在于:
1)、innerHTML与outerHTML在设置对象的内容时包含的HTML会被解析,而innerText与outerText则不会。
2)、在设置时,innerHTML与innerText仅设置标签内的文本,而outerHTML与outerText设置包括标签在内的文本。
3)、outhtml innerText(非W3C)
059、如何进行DOM节点筛选
1、可以通过nodeType
1 代表元素节点 2 代表属性节点 3 代表文本节点
function getNode(ele){
var aNode = ele.childNodes;
var newArr = [];
for(var i=0;i<aNode.length;i++){
if(aNode[i].nodeType == 1){
newArr.push(aNode[i])
}
}
return newArr;
}
060、 childNodes与children、attributes 的区别
如果想获取到子元素的element节点,最好使用children方法,childNodes方法以及firstChild方法在现代浏览器中使用,都会把元素标签中的空白节点检测出来,一般我们使用这两个方法都是为了获取到元素的元素节点,空白节点会给我们造成很多不必要的bug,而children方法则是只检测element元素节点
attributes:获取当前元素节点的所有属性节点集合