DOM获取元素和更改属性

最新推荐文章于 2023-01-06 08:28:43 发布
最新推荐文章于 2023-01-06 08:28:43 发布
阅读量221 收藏
点赞数
分类专栏： JavaScript DOM笔记
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/DF11G_0001/article/details/106676038
版权

目录

 

DOM简介

DOM的节点

获取元素

三种方法

根据ID获取

根据标签获取

根据class属性获取

获取和设置属性

获取属性

设置属性

获取子元素属性 childNodes

nodeType属性

nodeValue属性

firstChild和lastChild

DOM简介

D:Document，文档。

O:Object，对象。

M:Model，模型。

DOM把一份文档用树表示。

DOM的节点

元素节点：DOM的原子节点。

文本节点：被包含在元素节点的内部。

属性节点：对元素做出具体的描述。

<p title="属性节点">文本节点</p>

获取元素

三种方法

根据ID获取

通过文档节点调用。

document.getElementById("");

根据标签获取

通过文档节点调用。

该方法返回一个数组，分别储存查询到的各个标签。

最低0.47元/天 解锁文章
DF11G_0001
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
DOM修改元素
Judian6974的博客
08-10 680
修改元素 （1）修改内容 function fun(){     //获取到指定元素     var p1 = document.getElementById("p1");     p1.innerText = "我被单机了！"; } 通过innerText属性可读取或设置标签的内部文本   function fun(){     //获取到指定元素     var
Web APIs-DOM-获取DOM元素、修改属性
qq_38210427的博客
04-12 688
1什么是dom文档对象模型）是用来呈现以及与任意 HTML 或 XML文档交互的API白话文：DOM是浏览器提供的一套专门用来的功能DOM作用开发网页内容特效和实现用户交互DOM 是什么？有什么作用？DOM 是文档对象模型操作网页内容，可以开发网页内容特效和实现用户交互2获取DOM对象1. 获取一个DOM元素我们使用谁？2. 获取多个DOM元素我们使用谁？3. querySelector() 方法能直接操作修改吗？可以。
如何通过DOM操作来 修改元素的属性
liulang68的博客
07-04 1219
【使用 DOM】为DOM元素设置样式
weixin_30416871的博客
08-16 277
1. 使用样式表 可以通过document.styleSheets属性访问文档中可用的CSS样式表，它会返回一组对象集合，这些对象代表了与文档管理的各个样式表。 每个样式表 都由一个CSSStyleSheet 对象代表，它提供了一组属性和方法来操作文档里的样式。 1.1 获得样式表的基本信息 第一步是获得定义在文档中的样式表的一些基本信息。 <!DOCTYPE h...
DOM模型-属性操作
weixin_34195142的博客
06-28 115
HTML 元素包括标签名和若干个键值对，这个键值对就称为“属性”（attribute）。“属性”本身是一个对象（Attr对象），但是实际上，这个对象极少使用。一般都是通过元素节点对象（HTMlElement对象）来操作属性。本章介绍如何操作这些属性。 一、Element.attributes 属性 元素对象有一个attributes属性，返回一个类似数组的动态对象，成员是该元素标签的所有属性节...
Vue获取DOM元素样式和样式更改示例
08-31
本篇文章主要介绍了Vue获取DOM元素样式和样式更改示例，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
Javascript Dom元素获取和添加详解
10-16
DOM元素的获取和添加是前端开发中的基础操作，对于创建交互式网页至关重要。 1. **DOM元素的获取** - `getElementById()`：这个方法通过指定的id值获取唯一匹配的DOM元素。例如，`document.getElementById('myID'...
jquery获取并修改触发事件的DOM元素示例【基于target 属性】
10-16
主要介绍了jquery获取并修改触发事件的DOM元素,结合实例形式分析了jQuery基于target 属性获取到触发该事件的dom并修改的相关操作技巧,需要的朋友可以参考下
vue获取DOM元素并设置属性的两种实现方法
11-29
这里我想到了2个方法： 方法一： 直接给相应的元素加id,然后再document.getElementById(“id”);...如果给子组件加ref,然后获取到该DOM元素之后改变相应的自定义属性的值，vue会报错： Avoid mutating a prop dir
JavaScript DOM元素尺寸和位置
10-24
JavaScript DOM元素尺寸和位置是前端开发中非常关键的一部分，它涉及到如何准确地获取和操作HTML元素在页面上的尺寸和定位。...理解这些属性和方法的工作原理，能帮助我们更好地控制和操纵网页元素，提升用户体验。
要在 JavaScript 中改变 DOM 元素的样式
weixin_42612405的博客
01-06 222
可以使用 JavaScript 的 style 属性来改变 DOM 元素的样式。例如： document.getElementById("myDiv").style.color = "red"; document.getElementById("myDiv").style.fontSize = "20px";
使用DOM动态改变页面外观----读取和设定元素属性
聚合博客室
01-03 1873
        在交互性较强的Web应用中，经常需要动态更改指定元素的属性值，假设变量obj是页面中一个元素的引用，根据W3C DOM标准，可以在JavaScript中使用obj.getAttribute(name)来取得属性的值，并且用obj.setAttribute(name, value)来设置属性值。网页标签中，class是一个常用的属性，用于指定某一个元素遵从一个或多个自定义样
获取DOM元素，修改属性
qq_59381940的博客
07-04 915
1.作用和分类作用：就是使用js去操作html和浏览器分类：DOM(页面文档对象模型)，BOM（浏览器对象模型）js分为ECMAScript（js语言基础）和WebAPIsWebAPI又分为DOM(页面文档对象模型)，BOM（浏览器对象模型）2.什么是DOMDOM(页面文档对象模型)是用来呈现以及与任意HTML或XHL文档交互的API白话文：DOM是浏览器提供的一套专门用来操作网页的功能 操作html和css作用：开发网页内容特效和实现用户交互3.DOM树将html文档以树状结构直观的表现出来，我们称之为文
DOM树、childNodes、节点的创建与操作
wu520xin的博客
03-06 884
DOM树中有4中节点类型            元素节点            属性节点            文本节点            注释节点        element对象        node对象            两者统称为DOM对象        节点的属性            nodeType 必须要了解            nodeName            ...
☆09☆DOM重点知识总结
zhongqingtian的博客
06-15 407
DOM重点知识总结
DOM——操作元素修改属性
weixin_45328723的博客
07-20 378
DOM修改属性
使用js改变DOM样式的三种方式 - className属性
ForestCat的专栏
04-02 8672
改变dom节点样式另一种方式是设置dom的className属性. .red{ color:red; } hello world var node=document.getElementById("a"); node.className="red"; 以上代码等同于 : hello world
DOM元素的属性（property）和特性（attribute）
weixin_33770878的博客
09-14 156
从jQuery的prop()和attr()方法说开去 jQuery中有两个获取DOM元素属性的方法：prop()和attr()，看似可以互相替换，但若搞不清这两个方法获取的到底是什么“属性”，有时就会出现令人困惑的结果。官方文档中，用了下面的例子来解释这两者的不同： <input type="checkbox" checked="c...
JS：通过getAttribute() / setAttribute()更改元素属性值实现点击更改按钮状态
Freya1010的博客
09-02 1709
1.前提： 代码环境：laravel 需求：更改html某一组件状态（我这里是按钮） 重点： 两个方法 getAttribute() setAttribute() 2.实现： 按照需求给组件添加自定义属性（可加可不加，根据具体情况，也可以用自身属性），我这里需要改变的是按钮状态，所以在 当前button 增加一个自定义属性values。 加载页面初始显示根据代码中的判断条件...
html dom如何修改元素属性
最新发布
07-13
要修改HTML元素的属性，你可以使用JavaScript来操作HTML DOM（文档对象模型）。以下是一些常见的方法： 1. 使用`getElementById`函数获取要修改的元素，并使用`.`操作符访问该元素的属性，然后进行修改。例如，如果...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值