Javascript（三十）元素节点属性和节点属性

于 2021-05-28 10:37:03 发布
阅读量368 收藏 1
点赞数 1
分类专栏： Javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44730244/article/details/117354376
版权

在这里插入图片描述
innerHtml 获取和设置标签间的文本 ，包含标签
在这里插入图片描述
innerText 获取和设置标签间的纯文本 ，不包含标签
在这里插入图片描述
outerHTML 取值：从外标签开始，到外标签结束。修改：将外标签整个替换
在这里插入图片描述
在这里插入图片描述
获取子节点的属性
childNodes
获取所有类型的节点：（包含元素节点、文本节点、属性节点、注释节点…所有类型的节点）
功能：访问当前节点下，所有的子节点。
返回值：伪数组、数组 数据类型：对象Nodelist

firstChild
功能：访问子节点中的首位
lastChild
功能：访问子节点中的最后一位
nextSibling 下一个同级节点
previousSibling 上一个同级节点
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
注意：空格和回车符也会算作单独的文本节点（键盘上的所有键都可以被当作文本节点）
在这里插入图片描述
获取元素节点：(只获取元素节点 IE8以下不兼容)

children : 获取所有的子元素节点

firstElementChild ：获取第一个子元素节点

lastElementChild :获取最后一个子元素节点

nextElementSibling ：获取下一个同级元素节点

previousElementSibling ：获取上一个同级元素节点
在这里插入图片描述

节点（属性、层级、操作）
m0_46420078的博客
11-22 4045
一、节点：网页中的所有内容都是节点 1.节点的属性 （1）节点类型：nodeType 元素节点 ---1 属性节点 ---2 文本节点 ---3 （文字、空格、换行） （2）节点名称：nodeName （3）节点值：nodeValue 2.节点层级 （1）根节点：<html>就是根节点，有且只有一个 （2）父节点：一个节点的上级节点 （3)子节点：一个节点的下级节点 （4）兄弟节点：具有相同父节点的节点 3...
JavaScript-节点属性知识讲解
OuYyds的博客
03-27 827
节点共有属性（元素节点有，属性节点有，文本节点有） var title = document.getElementsByTagName('title')[0] console.log(title.nodeName); //nodeName节点名称 console.log(title.nodeType); //nodeType ​ //节点类型： 元素节点； 属性节点；文本节点 console.log(title.nodeValue); ​ //节点值 ： 元素节点为nul...
前端学习js篇01——元素节点，属性节点，文本节点，节点属性
weixin_30647065的博客
07-03 431
前言 简单分清元素节点，属性节点，文本节点，以及节点属性 正文 先看一张图 1.黑色框的就是元素（element）节点了，通俗的说，html的标签都可以称为元素节点。 2.红色框的就是属性（attr）节点了，它与元素节点是父子关系。 3.蓝色框就是文本（text）节点了，它与元素节点是父子关系，但是与属性不是兄弟关系。 4.节点属性，就是以上的三种节点的属性，如nodeType（...
元素节点、属性节点和文本节点
weixin_34223655的博客
08-22 274
2019独角兽企业重金招聘Python工程师标准>>> ...
元素节点、属性节点
java_zhaoyanli的专栏
03-16 400
/* 元素节点 console.log(s1.__proto__); console.log(s1.__proto__.__proto__); console.log(s1.__proto__.__proto__.__proto__); */ /*属性节点 console.log(s1.attributes["id"].__proto__); console.log(s1.attri
属性和属性节点
Cao_Mary的博客
05-28 3594
1.什么是属性？ 属性就是对象身上保存的变量 只要对象身上都可以添加属性(无论是自定义对象,还是DOM对象) // 1.自定义一个对象 var obj = {}; console.log(obj); // 2.动态给自定义对象添加属性 obj.name = "lnj"; // name就是对象obj的一个属性 obj.age = 33; // age就是对象obj的一个属性 console.log...
示例4：操作节点属性.rar_javascript操作节点属性
09-20
标题“示例4：操作节点属性.rar_javascript操作节点属性”表明我们将探讨如何修改和访问这些节点的属性。属性是元素的额外信息，例如`id`、`class`、`src`等。以下是一些常见的操作： 1. **获取属性值**：使用`...
JavaScript HTML DOM元素 节点操作汇总
10-16
节点分为多种类型，如元素节点、属性节点、文本节点等。节点具有关键属性，如`nodeName`（节点名称）、`nodeValue`（节点值）和`nodeType`（节点类型）。例如，元素节点的`nodeType`通常为1，文本节点为3，注释节点...
Javascript删除指定元素节点的方法
10-22
本文将详细讨论如何使用JavaScript来删除指定的元素节点。 首先，了解DOM模型是操作DOM元素的基础。DOM是一种以树形结构表示HTML和XML文档的编程接口。在这种模型中，HTML文档被表示为节点的层级结构，包括元素节点...
jacascript DOM节点——元素节点、属性节点、文本节点
08-30
JavaScript DOM（Document Object Model）是Web开发中用于操作...理解元素节点、属性节点和文本节点的概念及其操作方法是JavaScript Web开发的基础。熟练掌握这些知识，可以帮助开发者更有效地实现页面交互和动态更新。
DOM中元素节点、属性节点、文本节点的理解
xyjikl
12-09 440
节点信息 每个节点都拥有包含着关于节点某些信息的属性。这些属性是： nodeName（节点名称）  nodeValue（节点值）  nodeType（节点类型）  nodeType nodeType 属性可返回节点的类型。 最重要的节点类型是：   元素类型 节点类型 元素(ELEMENT_NODE) 1   
JS 元素节点的主要属性和方法
qq_45560350的博客
08-22 374
元素节点的一些属性 innerHTML 获取或修改该元素节点的HTML结构内容 <div> </div> <script> var div = document.getElementsByTagName('div')[0] </script> 追加 innerText（火狐不兼容）/ textContent（火狐兼容 老版本IE不兼容）获取或修改该元素节点的文本内容 <div> <i>123</i>
浅析~DOM结构中的元素节点、属性节点、文本节点
热门推荐
风一样的少年
08-28 1万+
首先明确什么是DOM： DOM=DocumentObjectModel，文档对象模型，DOM可以以一种独立于平台和语言的方式访问和修改一个文档的内容和结构 DOM是表示和处理一个HTML或XML文档的常用方法 DOM的设计是以对象管理组织（OMG）的规约为基础的，因此可以用于任何编程语言。最初人们把它认为是一种让JavaScript在浏览器间可移植的方法，不过DOM的应用已经远远超出这个范围...
节点对象的方法和属性
weixin_44540178的博客
05-27 841
开发工具与关键技术：HTML DOM节点方法 作者：Li Mingrun 撰写时间：2019年5月27日 在之前的文章中有提过HTML DOM文档对象模型，其中是对节点的介绍。 在HTML文档中的而全部内容都属于节点。 例如： 1，整个文档是一个文档节点 2，每个 HTML 元素是元素节点 3，HTML 元素内的文本是文本节点 4，每个 HTML 属性是属性节点 5，注释是注释节点 HT...
认识DOM的三大节点：元素节点，文本节点，属性节点以及nodeName,nodeType,nodeValue的区别
你为什么不努力的专栏
04-12 1万+
既然看做树形结构，那么就有对应的节点。DOM中有三大节点，分别是元素节点，文本节点，属性节点 元素节点：构成了DOM的基础。文档结构中，是根元素，代表整个文档，其他的还有,,等等。元素节点之间可以相互包含(当然遵循一定的规则) 文本节点：包含在元素节点中。 属性节点：元素都可以包含一些属性，属性的作用是对元素做出更具体的描述。
DOM初探（11）——元素节点的一些属性和方法，封装函数insertAfert()，将目标节点背部的节点顺序逆序
abraham的博客
02-14 8092
DOM基本操作： Element节点的一些属性 innerHTML innerText/textContent（老版本IE不好使） Element节点的一些方法： ele.setAttribute(“属性名”,”属性值”) ele.getAttribute(“属性名”)； innerHTML： <!DOCTYPE html...
元素节点不是属性节点的父节点，元素节点和元素包含的内容有区别，一个包含文本节点，一个包含文本...
weixin_30423977的博客
06-21 351
元素节点之间才有父子节点的关系？ 属性节点只是包含的关系？不是父子关系。因为属性每个人都有， 节点类型不同，不能有父子关系狗狗不能生猫猫另外属性节点当然不能出现在dom树里任意一个元素节点都有几十上百个属性节点 <div id="foo" class="xxx"></div>hello<p id="foo2"></p><!-- com...
DOM 中，元素节点、属性节点、文本节点讲解
gouxudong19的专栏
10-11 590
转载自http://a630147825-yahoo-com-cn.iteye.com/blog/698729 节点信息 每个节点都拥有包含着关于节点某些信息的属性。这些属性是： nodeName（节点名称）nodeValue（节点值）nodeType（节点类型） nodeType nodeType 属性可返回节点的类型。 最重要的节点类型是：
js查找元素和设置dom节点属性和样式浅析
heshengfu1211的博客
08-08 1636
 以前一直做PC端的web开发，习惯了使用jquery操作文档的dom节点和选择元素，如今转到移动端开发更多的用到了原生js，也用到了hbuilder 的mui框架来开发移动App。但是发现mui框架的文档介绍里并没有关于类似jquery那种定位dom节点，选择器和修改属性和样式的Api。我们知道，原生js代码是在各种设备和浏览器中兼容性最好的，于是这两天研究了javascript操作dom节点属...
JavaScript DOM操作：元素、属性和文本节点详解
"本文主要探讨JavaScript中的DOM节点，包括元素节点、属性节点和文本节点，旨在帮助读者理解和掌握如何在JavaScript中操作HTML元素及其属性。" 在JavaScript中，DOM（Document Object Model）是一种用于表示HTML或...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值