通过DOM操作获取html页面元素

最新推荐文章于 2021-06-03 20:15:44 发布
原创 最新推荐文章于 2021-06-03 20:15:44 发布 · 508 阅读 · 1 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#DOM #JavaScript

本文介绍通过ID名、Tag名、Class名及Selector方法等五种方式获取DOM元素的技巧，适用于非IE和IE9及以上浏览器。

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

1.通过ID名
document.getElementById()

2.通过Tag名
document.getElementByTagName()
document.getElementsByTagName()

3.通过Class名
document.getElementsByClassname()

4.通过Selector方法
document.querySelector()
document.querySelectorAll()

5.获取body
document.body

6.获取html
document.document.Element

注：
123括号内使用 标签名的字符串形式
4使用 加上选择器符号的字符串形式
非IE和>=IE9才可以使用34

DOM访问html元素（通过id访问或通过节点关系访问）和对html元素进行增删改查
Birdlun的博客
07-06 671
目录 访问html元素的两种方法 根据id访问 列：练习根据id访问 列：获取body下所有节点的名称 通过节点关系访问html元素 常用属性和方法 列：练习通过节点关系访问html元素（重点） DOM对html元素进行增删改查 创建节点 复制节点 添加、删除节点 访问html元素的两种方法 根据id访问 var mya=document.getElementById...
通过获取网页的DOM操作网页元素的软件源码
04-09
通过获取网页的DOM操作网页元素喜欢VB的朋友,相信它肯定可以提高编码的效率!
获取HTML元素3个方法：document.getElementsByName()、document.getElementById()、document.getElementsByTagName()
热门推荐
小哥骑单车
11-24 6万+
获取HTML元素3个方法比较：document.getElementsByName()、document.getElementById()、document.getElementsByTagName() document.getElementsByName() 是根据控件名称获取这个控件对象，因为控件名称可以相同，返回的是一个对象数组。 document.getElementBy...
JavaScript之DOM文档对象模型--对HTML元素的访问操作
diakuicu0780的博客
08-10 831
1、DOM是文档对象模型（Document Object Model）的简称。 当网页加载时，可以将结构化文档在内存中转换成对象树。 简单的说，DOM并不是一种技术，而是一种访问结构化文档的思想。借助DOM模型，我们可以对DOM树进行修改、删除、新增等操作，让结构化文档动态化。 2、DOM模型中的节点--文档可以说是由节点构成的集合。在DOM模型中有以下3种节点： （1）元...
DOM对HTML元素访问操作
Mark的博客
10-21 1044
1、什么是DOM？ DOM是文档对象模型（Document Object Model）的简称。当网页加载时，可以将结构化文档在内存中转换成对象的树。 以下是一个HTML DOM树： 简单的说DOM并不是一种技术，而是访问结构化文档的一种思想。借助DOM模型，我们可以对DOM树进行修改、删除、新增等操作，让结构化文档动态化。 2、DOM节点 DOM模型中的节点--文档可以说是由节
dom对html元素访问操作
weixin_30437847的博客
07-01 111
根据ID访问HTML元素：通过document对象调用getElementById()方法来查找具有唯一id属性值的元素。 利用节点关系访问HTML元素。常用的属性和方法如下： parentNode 返回当前节点的父节点 previousSibling 返回当前节点的前一个兄弟节点 nextSibling...
vue获取DOM元素并设置属性的两种实现方法
08-29
在使用Vue框架开发项目时，我们常常需要获取DOM元素并对其进行操作，比如设置属性或样式。Vue提供了多种方式来实现这一需求，本文主要介绍两种方法：一种是通过给元素添加id属性，另一种是利用Vue的ref属性。 首先...
详解JS获取HTML DOM元素的8种方法
10-19
本文将详细介绍在JavaScript中获取HTML DOM元素的八种常用方法，这些方法在实际开发中有着广泛的应用，能够帮助开发者有效地管理和操作网页元素。 1. 通过ID获取（getElementById） getElementById是document对象的...
头歌教学实践平台 Web前端开发基础 JavaScript学习手册十四：HTML DOM-文档元素的操作（二）
最新发布
01-20
总的来说，理解和熟练掌握HTML DOM的元素操作是成为优秀Web前端开发者的基础。通过学习本教程，你将能够更加自如地使用JavaScript动态地改变网页内容，实现丰富的交互效果。这不仅提升了用户体验，也为网页应用的...
Vue获取DOM元素样式和样式更改示例
08-31
在进行Web开发时，经常需要操作DOM元素的样式，以实现更加动态和响应式的网页布局。Vue.js作为一个流行的前端框架，提供了非常方便的方法来操作DOM元素的样式。本文将详细介绍如何在Vue中获取DOM元素的样式以及如何...
Jquery方式获取iframe页面中的 Dom元素
10-25
为了获取iframe中的DOM元素，我们可以通过jQuery来实现这一目标。在具体的实现过程中，需要注意iframe中的内容必须和主页面出于同一个域中，否则会受到浏览器同源策略的限制，无法获取到其中的DOM元素。这是因为...
JS获取网页中HTML元素的几种方法分析
05-10
JS获取网页中HTML元素的几种方法分析
DOM操作html元素
小小大青春
12-29 319
首先第一步获取元素对象： 如何获取元素对象：可以根据以下 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> /* * 【案例】通过do...
通过哪些方法可以获取页面的html元素,JavaScript获取页面元素的常用方法详解
weixin_29031161的博客
06-03 4680
1、通过标签获取元素，返回一个数组var li = document.getElementsByTagName('li');//标签获取元素li[0].innerHTML;// 查看获取元素的内容li[0].innerHTML = "content";//修改获取到标签中的内容2、通过id获取页面元素var header = document.getElementById("header");//...
使用DOM操控各类HTML元素
dcul39379的博客
09-07 180
'1.WebEdit: 'HTML源代码样例: '<INPUT type="text" value="QuickTest" id="ID_001" name="NAME_001"> 'QTP中代码样例: '操作方式1: '获取DOM对象 set oDocument = Browser("Browser").Page("Page").Object '使用Ge...
html页面获取元素,JavaScript中获取HTML元素值的三种方法
weixin_36295555的博客
06-03 4355
JavaScript中取得元素的方法有三种：分别是：1、getElementById() 方法：通过id取得HTML元素。2、getElementsByName()方法：通过name取得元素，是一个数组。3、getElementsByTagName()方法：通过HTML标签取得元素，是一个数组。如果要取得值可以使用value，如：var x=document.getElementById("id"...
利用DOM对HTML元素进行操作
尽力而为
03-11 870
额，在写一个页面的时候get到了一个难题，就是如何利用JS 计算table中的input值，表单代码如下： 由于采用了框架，使得中的name 带有了 . 符号，JS引擎加载会报错。想了很久，尝试使用DOM来操作。 有点长，将就看吧o(╯□╰)o 通过DOM操作实现了这一功能。不过人懒，最后setvalue的时候还是给 总计 一栏设了个 ID。 另： .item() 的使
通过哪些方法可以获取页面的html元素,干货 | JS中你必须知道的8种获取元素属性方法...
weixin_35144647的博客
06-03 1120
原标题：干货 | JS中你必须知道的8种获取元素属性方法在Web前端开发中经常用到的技术：获取元素属性的一系列方法【innerHTML、outerHTML、innerText 、outerText、value、text、html，val】。这些方法，大家应该用过，如果让你说出它们的一些区别和联系，能答得上来吗? innerHTML 属性在读模式下，innerHTML属性返回与调用元素的所有子节点(...
DOM通过技术操作HTML
weixin_45525071的博客
11-09 181
1.DOM：查找 HTML 元素 1.通过 id 找到 HTML 元素 2.通过标签名找到 HTML 元素 3.通过类名找到 HTML 元素 通过 id 查找 HTML 元素 <div id="box" class="do`在这里插入代码片`"> <p></p> <p></p> </div> &...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值