javascript-核心知识总结

纪水一

于 2023-05-18 16:51:24 发布

阅读量1.5k

点赞数 2

CC 4.0 BY-SA版权

分类专栏：网页文章标签： javascript 前端

本文链接：https://blog.csdn.net/weixin_49349476/article/details/130740657

这篇文章介绍了DOM的基础和进阶知识，包括DOM对象、节点类型、元素操作以及事件处理。在DOM操作中，详细讲解了如何获取和操作元素，如通过ID、标签名或选择器。事件部分涵盖了鼠标事件、键盘事件和页面事件，并介绍了事件监听器的概念。此外，还提到了window对象的功能，如窗口操作、对话框、定时器和location对象。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

4、innerHTML和innerText

（一）DOM基础

1、DOM对象

DOM，全称是“Document Object Model（文档对象模型）”，它是由W3C定义的一个标准。

DOM的结构是采用“树形结构”，用“树节点”的形式来表示页面中的每一个元素，HTML元素是树根，也叫根元素，在html下面，我们发现有head和body这两个分支，它们位于同一层次上，并且有着共同的父节点（即html），所以它们是兄弟节点。以此类推。

2、节点类型

在JavaScript中，节点分为很多种类型。DOM节点共有12种类型，但是常见的只有下面3种

元素节点：表示元素
属性节点：表示属性
文本节点：表示文本

<div id="wrapper">绿叶学习网</div>

在JavaScript中，我们可以使用nodeType属性来判断一个节点的类型。不同节点的nodeType属性值如下：

3、获取元素

document.getElementById（"id名"）：通过id来选中元素

document.getElementsByTagName（"标签名"）：通过标签名来选中元素

document.getElementsByClassName（"类名"）：想通过class来选中元素

document.querySelector（"选择器"）：使用CSS选择器来获取选取满足选择条件的第1个元素

document.querySelectorAll（"选择器"）:使用CSS选择器来获取选取满足选择条件的所有元素

document.getElementsByName（"name名"）:通过name属性来获取表单元素

document.title：获取title元素

document.body：获取body元素