最后
开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
3.注意js时间线
1.通过id查找
var div1 = document.getElementById(‘div1’);//返回节点
2.通过标签名查找
var ps = document.getElementsByTagName(‘p’);//返回数组
3.通过class查找
var txt = document.getElementsByClassName(‘txt’);//返回数组
区别:
1.访问方式:
通过id查找时,只能通过document对象查找;
在js中,id唯一,如果html出现两个相同的id,后者会被忽略;
通过标签名或class查找时,可以在任意标签节点上使用;
2.返回数据的类型:
通过id查找时,直接返回节点
通过标签名或class查找时,即使结果只有一个,也是保存在数组中;
可以通过方括号来访问数组内容(txt[0]标签节点),也能使用length属性;
另注:
即使一个标签有多个class,
也能通过document.getElementsByClassName()找到;
4.先按id找到div1,再用class找到.txt:
html文件:
div1
p1
p2
div1
js文件:
var div1 = document.getElementById(‘div1’);
var p_txt = div1.getElementsByClassName(‘txt’);
由找到的已知节点或document节点向下层寻找,目的是找到某节点,如果已经用id找到了p2,就不能再从p2找txt,因为不是下层
查找结果只有一个:p#p1.txt.txt1
html文件:
js文件:
//添加节点
var div1 = document.getElementById(‘div1’);//获取节点
var p = document.createElement(‘p’);//创建p标签
var ptxt = document.createTextNode(‘p1’);//创建文本节点
p.appendChild(ptxt);//文本节点关联到标签节点
div1.appendChild§;//添加标签节点至DOM树
结果:
先在html文件中添加一个div2:
js文件:
//删除节点
var div2 = document.getElementById(‘div2’);//获取div2
//方法一:通过父节点div1删除子节点div2
div1.removeChild(div2);
//方法二:通过树的关系,找到div2的父节点,再删除自己,不用直接查找父节点
div2.parentNode.removeChild(div2);
1.对于html定义好的属性:
前端面试题汇总
JavaScript
开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
性能
linux
前端资料汇总
+最新讲解视频】](https://bbs.csdn.net/topics/618166371)**
性能
linux
前端资料汇总