第四天记录

Posted 2020-10-11 叶墨悻

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了第四天记录相关的知识，希望对你有一定的参考价值。

《JS操作》

JS操作属性

aaa.getAttribute("属性名"); - 取出aaa这个dom对象的属性名中的属性值

aaa.removeAttribute("属性名"); -移除该属性

aaa.setAttribute("属性名","值"); --添加/修改此属性

window.setTimeout("b()", 3000); --等待3秒，执行b这个方法,执行一遍
window.setInterval(‘aaa()‘, 1000); --每隔1秒都执行aaa这个方法，循环执行

clearInterval(time); --清除定时器

window.clearInterval(延迟的id) --清除setTimeout

操作样式

变量名.style.样式名="";

相关元素操作
var a = document.getElementById("id"); 找到a；

var b = a.nextSibling; 找到a的下一个同级元素，包含空格；

var b = a.previousSibling; 找到a的上一个同级元素，包含空格；

var b = a.parentNobe;找到a的父级元素；

var b = a.childNobes;找到a的下一级子级元素，找到的是数组；

var b = a.firstChild 第一个子元素,lastChild 最后一个元素,childNodes[n] 找第几个元素;

操作样式

元素.style.样式=""

1 function getStyle(obj){
2         obj.style.width = "200px";
3         obj.style.backgroundColor = "green";
4         var divobj = document.getElementById("fu").lastChild;         
5         alert(divobj.getAttribute("name"));
6     }

1.通过节点关系找元素
2.注意换行在浏览器中被算作了text节点<br>

同级节点：
Node.previousSibling 　　　　 // 返回前一个节点，如果没有则返回null
Node.nextSibling 　　　　　　 // 返回后一个节点

父节点：
Node.parentNode

子节点：
Node.childNodes 　　　　 //获取子节点列表NodeList; 注意换行在浏览器中被算作了text节点，如果用这种方式获取节点列表，需要进行过滤
Node.firstChild　　　　　　 //返回第一个子节点
Node.lastChild 　　　　　　 //返回最后一个子节点

1 function add(obj){
2         var div = document.createElement(‘div‘);
3         div.innerhtml = "234";
4         obj.appendChild(div);
5     }

1 <body>
2 <div id="dd" style="width: 100px; height: 100px; background-color: red;" onClick="getStyle(this)"></div>
3 <div id="fu" name="父标签"><div name="子标签"></div><div name="子标签 同级标签"></div></div>
4 </body>

以上是关于第四天记录的主要内容，如果未能解决你的问题，请参考以下文章