diff --git "a/44 \347\275\227\345\220\257\346\201\222/\344\275\234\344\270\232/2022-11-20 \345\244\215\345\210\266 \344\275\234\344\270\232.html" "b/44 \347\275\227\345\220\257\346\201\222/\344\275\234\344\270\232/2022-11-20 \345\244\215\345\210\266 \344\275\234\344\270\232.html" new file mode 100644 index 0000000000000000000000000000000000000000..b49f0f14f4085e20b827104bbaa9fa0973c16a5a --- /dev/null +++ "b/44 \347\275\227\345\220\257\346\201\222/\344\275\234\344\270\232/2022-11-20 \345\244\215\345\210\266 \344\275\234\344\270\232.html" @@ -0,0 +1,34 @@ + + + + + + + Document + + + +   + +
+ +
+ + + \ No newline at end of file diff --git "a/44 \347\275\227\345\220\257\346\201\222/\344\275\234\344\270\232/2022-11-20 \347\202\271\345\207\273 \344\275\234\344\270\232.html" "b/44 \347\275\227\345\220\257\346\201\222/\344\275\234\344\270\232/2022-11-20 \347\202\271\345\207\273 \344\275\234\344\270\232.html" new file mode 100644 index 0000000000000000000000000000000000000000..3f4617f31a1f8c8321a7b6f7d5d6bb1870413d49 --- /dev/null +++ "b/44 \347\275\227\345\220\257\346\201\222/\344\275\234\344\270\232/2022-11-20 \347\202\271\345\207\273 \344\275\234\344\270\232.html" @@ -0,0 +1,33 @@ + + + + + + + Document + + + + +
+
+ + + \ No newline at end of file diff --git "a/44 \347\275\227\345\220\257\346\201\222/\347\254\224\350\256\260/2022-11-18 \347\254\224\350\256\260.md" "b/44 \347\275\227\345\220\257\346\201\222/\347\254\224\350\256\260/2022-11-18 \347\254\224\350\256\260.md" new file mode 100644 index 0000000000000000000000000000000000000000..4bded46b74835bda631824e0c9d090ad836280f4 --- /dev/null +++ "b/44 \347\275\227\345\220\257\346\201\222/\347\254\224\350\256\260/2022-11-18 \347\254\224\350\256\260.md" @@ -0,0 +1,78 @@ +DOM0 + + //根据class获取元素: 返回: HTMLCollection (数组) + // console.log(document.getElementsByClassName('H2')); + + //根据name属性获取元素对象: NodeList(伪数组):只能获取下标和长度 + // console.log(document.getElementsByName('username')); + + //根据标签名获取元素对象:返回 HTMLCollection + // console.log(document.getElementsByTagName('input')); + + //根据id属性获取元素对象,返回当前元素对象 + // console.log(document.getElementById('thirdH2')); + +DOM2 + //找class=H2的元素对象,如果不止一个,返回第一个元素对象 + //根据class : ('.className') + //根据Id : ('#id') + //根据标签名: ('div') + // console.log(document.querySelector('div')); + //找全部 + // console.log(document.querySelectorAll('.H2')); + +节点类型为1:元素节点 + //节点类型3:文本节点 + //节点类型2: 属性节点 + +节点 + // console.log(document.head); + // console.log(document.title); + // console.log(document.body); + +节点(node)类型 + // console.log(document.body.childNodes); + // // console.log(document.body.childNodes); + // var childList = document.body.childNodes; + // var len = childList.length; // + // for (let i = 0; i < len; i++) { + // console.log(childList[i].nodeType +':'+ childList[i].nodeName +':'+ childList[i].nodeValue); + // } + +元素(elements) + +查看body中有几个元素节点 + +console.log(document.body.childElementCount); + // console.log(document.body.children); + +查看子节点 + // console.log(document.body.firstChild);//所有节点中的第一个节点 + // console.log(document.body.firstElementChild);//找第一个元素节点 + +查看父节点 + console.log(document.body.children[0].parentElement); + +上一个元素节点 + console.log(document.body.children[1].previousElementSibling); + +下一个元素节点 + console.log(document.body.children[1].nextElementSibling); + +创建元素节点 + // var newH2 = document.createElement('h2'); + // var txt = document.createTextNode('我是新添加的H2'); + // newH2.appendChild(txt); + +添加子元素节点 + // div.appendChild(newH2); + +删除子节点:removeChild(元素对象:h2) + // var h2 = document.getElementById('h2'); + // div.removeChild(h2); + +改:replaceChild + // div.replaceChild(newH3,h2); + +在...之前插入一个节点 + div.insertBefore(newH3,h2); \ No newline at end of file