本文主要是介绍关于HarmonyOS的学习，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
day22
一、DOM
+ 文档对象模型+ 在DOM的世界里面，把所有的标记称之为节点，把标记的结构称之为DOM树+ 告诉咱们标记在文档里面是以树形结构存在的+ 节点分类=> document 文档节点=> eLement 标记节点=> attribute 属性节点=> comment 注释节点=> text 文本节点
二、访问节点
nodeName节点名称 nodeType节点类型（返回的时数字） nodeValue节点值（不是所有的节点都有值） firstChild访问第一个节点（包含所有的节点类型） childNodes 访问所有的节点（返回的伪数组）标记节点名称返回的是大写字母的标记名 lastChild访问最后一个节点 box.firstElementChild访问元素节点 box.children[1].previousElementSibling访问上一个兄弟节点 box.children[1].nextElementSibling访问下一个兄弟节点
三、属性节点操作
// setAttitude('属性名', '属性值') 设置属性// 注意点：如果这个标记本身就有的属性可以直接使用，如果没有的话那么必须要使用style形式来设置pic.setAttribute('src', 'https://tse2-mm.cn.bing.net/th/id/OIP-C.FzD9xtNlBMhuxx-XRgqvrgAAAA?w=190&h=286&c=7&r=0&o=5&dpr=2&pid=1.7')pic.setAttribute('width', '200')pic.setAttribute('style', 'border:1px solid red;')div.setAttribute('class', 'box')
// getAttitude('属性名') 获取属性值// console.log(div.getAttribute('class')) // box// getAttitudeNode('属性名') 获取属性// console.log(div.getAttributeNode('class')) // class="box"// console.log(div.getAttributeNode('class').nodeValue) // box
// removeAttitude('属性名') 删除属性// div.removeAttribute('class')
console.log(div.getAttributeNode('class').nodeName)console.log(div.getAttributeNode('class').nodeType)console.log(div.getAttributeNode('class').nodeValue)
// 判断你拿到是不是一个属性，可以使用nodeTypeconsole.log(div.getAttributeNode('class').nodeType === 2) // true
四、元素节点操作
// 创建标记节点var p = document.createElement('p')p.innerHTML = 'hello，我是新来的'var span = document.createElement('span')span.innerHTML = '我是张'
var b = document.createElement('b')b.innerHTML = '最近长胖了'
// 追加新建元素到页面document.body.appendChild(p)document.body.appendChild(span)
// 把创建标记追加到已有标记的前面// 参数1表示新创建的标记// 参数2表示放在那个已有标记的前面// document.body.insertBefore(b, p)
var h1 = document.querySelector('h1')// document.body.insertBefore(b, h1)
// 删除标记节点// b.remove()
// document.body.removeChild(b)
// 克隆（复制）标记节点// 参数可以写一个true，true表示深克隆（把标记的内容和子标记都可以复杂），不写默认是浅克隆（只克隆标记）// var cloneB = b.cloneNode()// var cloneB = b.cloneNode(true)// console.log(cloneB)
// 替换标记节点// 参数1表示要替换成那个节点// 参数2表示被替换的节点// document.body.replaceChild(p, b)
// 获取父元素// 注意点：元素节点的父节点只能是元素类型，而不能是其他的节点类型。因此下面只有语义上的区分，效果是一样的// parentNode 表示获取父元素节点，但是它包含所有节点类型console.log(h1.parentNode.parentNode)// parentELement 表示获取父元素节点，但是它只包含元素节点console.log(h1.parentElement.parentElement)
这篇关于关于HarmonyOS的学习的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
