DOM的提供的五种对HTML元素操作的方法

最新推荐文章于 2023-05-22 19:17:14 发布
最新推荐文章于 2023-05-22 19:17:14 发布
阅读量617 收藏
点赞数 2
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_37288477/article/details/80363131
版权

文档对象模型（Document Object Model，简称DOM），是W3C组织推荐的处理可扩展标志语言的标准编程接口。在网页上，组织页面（或文档）的对象被组织在一个树形结构中，用来表示文档中对象的标准模型就称为DOM。Document Object Model的历史可以追溯至1990年代后期微软与Netscape的“浏览器大战”，双方为了在JavaScript与JScript一决生死，于是大规模的赋予浏览器强大的功能。微软在网页技术上加入了不少专属事物，既有VBScript、ActiveX、以及微软自家的DHTML格式等，使不少网页使用非微软平台及浏览器无法正常显示。DOM即是当时蕴酿出来的杰作。

DOM 

D： doucument 文档

O： Object

M:model模型

getElementById
这个方法将返回一个与那个有着给定Id属性值的元素节点对应的对象。
getElementsByTagName
这个方法返回一个对象数组，每个对象分别对应着文档里有着给定标签的一个元素
getElementsByClassName
这个方法可以让我们通过class属性中的类名来访问元素
getAttribute
这是一个函数，他只有一个参数--你打算查询的属性的名字 只作用于元素节点
setAttribute
他允许我们对属性节点的值做出修改，只作用于元素节点  接受二个参数，第一个是你要修改的元素属性名称，第二个参数是指你所修改的内容
温清夜
关注
  • 2
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
输出html指令 v-html
xiaoxingxingzai的博客
08-27 865
v-html 解析了标签属性，而不是如v-text那样原样输出。 <body> <div id="app"> <p v-html="website"></p> </div> </body> <script> new Vue({ el:"#app", data:{ ...
动态创建HTML内容
小樓東風的专栏
11-20 7827
原文地址：http://www.cnblogs.com/penny/archive/2008/09/01/1281293.html 看完此文请再看看提高你的DHTML性能>>动态创建HTML内容除了用 document.write()和document.innerHTML()以外，还可以用DOM提供的方法：createElement()和createTextNode() 1.先来说
【DOM】DOM操作之如何修改元素的内容与属性_02
青春木鱼的博客
05-04 3293
DOM操作之如何修改元素的内容与属性。元素的内容修改分为3种：元素开始标签到结束标签之间的原始的HTML内容、纯文本内容以及获取或修改表单元素的值；元素的属性修改分为3种：字符串类型的HTML标准属性、bool类型的HTML标准属性、自定义扩展属性
如何使用DOM操作HTML元素
2301_77795034的博客
05-22 1583
这段代码首先通过类名为“my-element”的元素获取到了这个元素，然后修改了它的style属性中的color和fontSize，将文字颜色变成了红色，并将字体大小改为了24像素。首先，你需要获取到这个元素。这段代码首先通过类名为“my-element”的元素获取到了这个元素，然后将其父节点中的appendChild()方法调用了，将这个元素移动到了新的位置。这段代码首先通过类名为“my-element”的元素获取到了这个元素，然后修改了它的textContent属性，将它变成了新的文本内容。
JS添加或删除HTML dom元素的方法实例分析
10-17
主要介绍了JS添加或删除HTML dom元素的方法,结合实例形式分析了javascript针对HTML DOM元素节点的创建、追加、删除等相关操作技巧与注意事项,需要的朋友可以参考下
详解JS获取HTML DOM元素的8种方法
12-07
什么是HTML DOM 文档对象模型（Document ...JS获取DOM元素的方法（8种） 通过ID获取（getElementById） 通过name属性（getElementsByName） 通过标签名（getElementsByTagName） 通过类名（getElementsByClass
JavaScript操作HTML元素和样式的方法详解
12-28
JavaScript HTML DOM 元素(节点) 创建新的 HTML 元素 如需向 HTML DOM 添加新元素，您必须首先创建该元素（元素节点），然后向一个已存在的元素追加该元素。  实例 <p id=p1>This is a paragraph. <p id=p2>This...
JavaScript HTML DOM元素 节点操作汇总
10-16
主要介绍了JavaScript HTML DOM元素 节点操作汇总,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
JavaScript基于Dom操作实现查找、修改HTML元素的内容及属性的方法
10-20
主要介绍了JavaScript基于Dom操作实现查找、修改HTML元素的内容及属性的方法,涉及javascript dom模型及事件响应相关操作技巧,需要的朋友可以参考下
通过DOM获取HTML元素的三种方式
程序员资料站
09-05 4413
转载自：http://www.runoob.com/js/js-htmldom.html 获取DOM元素的三种方法：    通过 id 找到 HTML 元素 &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;title&gt;菜鸟教程(runoob.com)&lt;/title..
Dom 获取元素的几种方式
qq_66198247的博客
05-23 9701
一.Dom简介 文档对象模型(Document Object Model，简称DOM ）)，是W3C组织推荐的处理可扩展标记语言(HTML或者XML）的标准编程接口。 W3C已经定义了一系列的DOM接口，通过这些DOM接口可以改变网页的内容、结构和样式。 二.Dom树 文档：一个页面就是一个文档，Dom中用document表示 ； 元素：页面中的所有标签都是元素，Dom中使用element表示； 节点：网页中的所有内容都是一个节点（标签，属性，文本，注释等），Dom中使用node表示 Dom
DOM——获取元素方式
weixin_68160847的博客
01-12 957
（1）获取元素 （2）对元素进行操作（设置其属性或调用其方法） （3）动态创建元素 （4）事件（什么时机做相应的操作）
JS中获取DOM的方法
知识点沉淀包括不限于前端
11-19 1087
获取DOM的方法 document.getElementById(‘id名’) 在document上下文下获取元素(通过Id获取的元素是一个元素对象，获取不到就是null) context.getElementsByTagName(‘标签名’) 通过指定的上下文获取指定的标签，获取的是一个元素集合，如果没有获取到元素，那就是空元素集合 context.getElementsByCla...
Web基础(从零开始)——DOM简介（获取元素的四种方法）
qq_57633498的博客
12-04 1221
文档对象模型（简称DOM）：是W3C组织推荐的处理可扩展标记语言（HTML或XML）的标准编程接口。 DOM树： 1.文档：一个页面就是一个文档，DOM中使用document表示； 2.元素：页面中的所有标签都是元素，DOM中使用element表示； 3.节点：页面中所有内容都是节点（标签、属性、文本、注释等），DOM中使用node表示； DOM把以上内容都看做是对象。 获取元素 1.根据ID获取 var element=document.getElementById(ID); eleme
使用DOM操控各类HTML元素
dcul39379的博客
09-07 139
'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...
输出dom对象的HTML,console 输出 DOM 对象
weixin_34467704的博客
06-30 1614
背景前端开发调试的时候，经常需要查看HTML DOM元素对象，如图所示：dom_object.pngDOM元素对象包含了HTML DOM的各种属性，例如：位置element.offsetHeightelement.offsetWidth事件绑定element.onclickelement.onkeydown子孙DOM节点和祖先DOM节点element.childNodeselement.paren...
DOM操作html元素
小小大青春
12-29 261
首先第一步获取元素对象： 如何获取元素对象：可以根据以下 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> /* * 【案例】通过do...
常用的 DOM 方法
wgchen
04-08 1579
阅读目录HTML DOM 树问题DOM对象常用对象的方法和属性HTML文档中的常用节点类型常用的Document的方法Element常用的属性和方法Node常用的属性和方法DOM对象的常用方法示例1、document 对象2、location3、innerText，innerHTML4、Element 元素5、Element 创建和添加元素6、属性操作DOM 事件处理DOM0级事件处理DOM2级事件处理程序创建DOM节点、添加DOM节点、设置节点属性测试代码DOM中Event 对象使用获取鼠标哪个键的点击获
DOM操作获取HTML中的元素的方法
weixin_39512308的博客
10-29 1846
什么是DOM DOM（Document Object Model）是一项W3C标准（World Wide Web Consortium）标准。定义了访问文档的标注：“W3C文档对象模型(DOM)是中立于平台和语言的接口，它允许程序和脚本动态地访问、更新文档的内容、结构和样式。”DOM标准被分为了3个不同的部分： 1.Core DOM：所有文档类型的标准模型 2.XML DOM：XML的文档标准模型 3.HTML DOM：HTML文档的标准模型 HTML DOM（文档对象模型） 当网页被加载时，浏览器会创建页
python qwebengineview 操作 dom html元素
最新发布
05-24
要操作 DOM 中的元素，可以使用 QWebChannel 类来实现 JavaScript 和 Python 之间的通信。 以下是一个简单的示例代码，演示如何使用 QWebChannel 和 JavaScript 来获取和更改 HTML 元素： ```python from PyQt5....

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值