javascript学习笔记:基础操作与节点获取技巧

需积分: 3 2 下载量 44 浏览量 更新于2024-09-09 收藏 5KB TXT 举报
JavaScript学习笔记 在这个详细的JavaScript学习笔记中,我们将会深入探讨JavaScript编程语言的基础概念和关键用法。JavaScript是一种广泛应用于Web开发的脚本语言,它主要用于网页交互和动态功能实现。以下是笔记中的主要内容: 1. DOM操作: - 事件处理:JavaScript通过`addEventListener`函数处理HTML元素的点击事件,确保在现代浏览器中使用统一的事件模型。例如,`onclick`属性虽然可用,但推荐使用`addEventListener`以支持异步加载和事件委托。 - 获取元素:文档对象模型(DOM)提供了多个方法来获取HTML元素。`getElementById`根据元素的唯一ID查找,`getElementsByTagName`返回具有指定标签名的所有元素的集合,`getElementsByTagName`和`getElementsByClassName`则按标签名或类名筛选元素。IE浏览器特有的`getElementsByName`用于获取带有特定name属性的元素。 2. 修改元素属性: - 修改元素值:如`var nameNode = document.getElementById("name");`用于获取元素节点后,可以通过`nameNode.value`访问或修改其value属性。 - 子节点操作:`childNodes`属性返回一个包含所有子节点的NodeList,包括文本节点、注释等。例如,`city.childNodes.length`可以获取城市元素下所有子节点的数量。 3. 遍历和选择节点: - 遍历节点:通过`getElementsByTagName("li")`获取所有li元素,`childNodes`或`getElementsByTagName`可用于遍历节点列表。 - 选择特定类型的子节点:`cityLiNodes.length`获取city元素下所有li子节点的数量。 4. 节点操作: - 访问第一个子节点:`firstChild`属性获取节点的第一个子节点。 - 访问节点值:`firstChild.nodeValue`访问并修改节点的文本内容,如`bjNode.firstChild.nodeValue = "";`用于清空节点值。 总结来说,这个JavaScript学习笔记涵盖了从事件处理、DOM元素获取到修改属性和节点遍历的重要知识点,有助于初学者理解如何在网页中实现动态交互和数据绑定。熟练掌握这些基础技能,将为进一步学习更复杂的JavaScript框架(如jQuery、React或Vue)奠定坚实基础。