手册

JS教程

简介使用输出语句语法注释变量 Let Const 运算符算数赋值数据类型函数对象事件字符串字符串方法字符串搜索字符串模板数字 BigInt 数字方法数字属性数组数组方法数组搜索数组排序数组迭代数组 Const 日期日期格式日期获取方法日期设置方法数学随机逻辑比较条件 Switch Loop For Loop For In Loop For Of Loop While Break 可迭代对象 Set Set 方法 Map Map 方法 typeof 类型转换解构位运算正则表达式运算符优先级异常作用域 Hoisting 严格模式 this 关键词箭头函数类模块 JSON 调试样式指南最佳实践错误性能保留词

JS版本

JS 版本 JS 2009 (ES5) JS 2015 (ES6) JS 2016 JS 2017 JS 2018 JS 2019 JS 2020 JS 2021 JS 2022 JS 2023 JS 2024 JS IE / Edge JS 历史

JS对象

对象定义对象属性对象方法对象显示对象访问器对象构造器对象原型对象引用

JS函数

函数定义函数参数函数调用函数 Call 函数 Apply 函数绑定闭包

JS类

类简介类继承 Static

JS Async

回调异步 Promise Async

JS HTML DOM

DOM 简介 DOM 方法 DOM 文档 DOM 元素 DOM HTML DOM 表单 DOM CSS DOM 动画 DOM 事件 DOM 事件监听程序 DOM 导航 DOM 节点 DOM 集合 DOM 节点列表

JS Browser BOM

Window Screen Location History Navigator 弹出框 Timing Cookies

JS Web API

Web API 简介 Web Form API Web History API Web Storage API Web Worker API Web Fetch API Web Geolocation API

JS AJAX

AJAX 简介 AJAX XMLHttp AJAX 请求 AJAX 响应 AJAX XML 文件 AJAX PHP AJAX ASP AJAX 数据库 AJAX 应用程序 AJAX 实例

JS JSON

JSON 简介 JSON 语法 JSON vs XML JSON 数据类型 JSON 解析 JSON 字符串化 JSON 对象 JSON 数组 JSON 服务器 JSON PHP JSON HTML JSON JSONP

JS vs jQuery

jQuery 选择器 jQuery HTML jQuery CSS jQuery DOM

JS图形

图形 Canvas Plotly.js Chart 谷歌图表 D3.js

JS参考手册

参考手册（类别排序）参考手册（字母排序）

首页大前端 JavaScript JavaScript

DOM 文档

阅读599

更新时间2025-08-07

DOM 方法

DOM 元素

HTML DOM Document 对象

文档对象代表您的网页。

如果您希望访问 HTML 页面中的任何元素，那么您总是从访问 document 对象开始。

下面是一些如何使用 document 对象来访问和操作 HTML 的实例。

查找 HTML 元素

方法	描述
document.getElementById(id)	通过元素 id 来查找元素
document.getElementsByTagName(name)	通过标签名来查找元素
document.getElementsByClassName(name)	通过类名来查找元素

改变 HTML 元素

方法	描述
element.innerHTML = new html content	改变元素的 inner HTML
element.attribute = new value	改变 HTML 元素的属性值
element.setAttribute(attribute, value)	改变 HTML 元素的属性值
element.style.property = new style	改变 HTML 元素的样式

添加和删除元素

方法	描述
document.createElement(element)	创建 HTML 元素
document.removeChild(element)	删除 HTML 元素
document.appendChild(element)	添加 HTML 元素
document.replaceChild(element)	替换 HTML 元素
document.write(text)	写入 HTML 输出流

添加事件处理程序

方法	描述
document.getElementById(id).onclick = function(){code}	向 onclick 事件添加事件处理程序

查找 HTML 对象

首个 HTML DOM Level 1 (1998)，定义了 11 个 HTML 对象、对象集合和属性。它们在 HTML5 中仍然有效。

后来，在 HTML DOM Level 3，加入了更多对象、集合和属性。

属性	描述	DOM
document.anchors	返回拥有 name 属性的所有元素。	1
document.applets	返回所有元素（HTML5 不建议使用）	1
document.baseURI	返回文档的绝对基准 URI	3
document.body	返回元素	1
document.cookie	返回文档的 cookie	1
document.doctype	返回文档的 doctype	3
document.documentElement	返回元素	3
document.documentMode	返回浏览器使用的模式	3
document.documentURI	返回文档的 URI	3
document.domain	返回文档服务器的域名	1
document.domConfig	废弃。返回 DOM 配置	3
document.embeds	返回所有元素	3
document.forms	返回所有元素	1
document.head	返回元素	3
document.images	返回所有元素	1
document.implementation	返回 DOM 实现	3
document.inputEncoding	返回文档的编码（字符集）	3
document.lastModified	返回文档更新的日期和时间	3
document.links	返回拥有 href 属性的所有和元素	1
document.readyState	返回文档的（加载）状态	3
document.referrer	返回引用的 URI（链接文档）	1
document.scripts	返回所有精选课程更多 PHP实战天龙八部之微信支付视频教程共5课时 17.2万人学习 PHP实战天龙八部之仿爱奇艺电影网站共49课时 77万人学习前端入门_HTML5 共29课时 61.7万人学习 CSS视频教程-玉女心经版共25课时 39.3万人学习 JavaScript极速入门_玉女心经系列共43课时 70.9万人学习独孤九贱(1)_HTML5视频教程共25课时 61.6万人学习独孤九贱(2)_CSS视频教程共22课时 23万人学习独孤九贱(3)_JavaScript视频教程共28课时 33.9万人学习独孤九贱(4)_PHP视频教程共89课时 125万人学习热门下载更多 phpStudy 2018最新版下载 vc9-vc14（32+64位）运行库合集（链接在下方）下载 VC9 32位下载 VC11 32位下载 php程序员工具箱完整版下载 VC14 32位下载 SublimeText3汉化版下载 Notepad++7.3.1 下载 phpStudy V8.1（Win64位）（已支持php8）下载关于我们免责申明意见反馈讲师合作广告合作最新更新 English php中文网：公益在线php培训，帮助PHP学习者快速成长！关注服务号技术交流群 PHP中文网订阅号每天精选资源文章推送 PHP中文网APP 随时随地碎片化学习 Copyright 2014-2025 https://www.php.cn/ All Rights Reserved \| php.cn \| 湘ICP备2023035733号