JS 获取节点属性值

最新推荐文章于 2024-05-06 02:35:52 发布
最新推荐文章于 2024-05-06 02:35:52 发布
阅读量1.4w 收藏 1
点赞数
分类专栏： 前端
getAttribute()方法
通过元素节点的属性名称获取属性的值。
语法：
elementNode.getAttribute(name)
说明:
1. elementNode：使用getElementById()、getElementsByTagName()等方法，获取到的元素节点。

2. name：要想查询的元素节点的属性名字

示例：

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>getAttribute()</title>
</head>
<body>   
<p id="intro">课程列表</p>  
    <ul>  
        <li title="第1个li">HTML</li>  
        <li>CSS</li>  
        <li title="第3个li">JavaScript</li>  
        <li title="第4个li">Jquery</li>  
        <li>Html5</li>  
    </ul>  
<p>以下为获取的不为空的li标签title值:</p>
<script type="text/javascript">
    var con=document.getElementsByTagName("li");
    for (var i=0; i< con.length;i++){
    text=con[i].getAttribute("title");
      if(text!=null)
      {
        document.write(text+"<br>");
      }
    } 
 </script> 
</body>
</html>

结果：

课程列表

  • HTML
  • CSS
  • JavaScript
  • Jquery
  • Html5

以下为获取的不为空的li标签title值:

第1个li
第3个li
第4个li


hedafighter2011
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
【JS】节点的获取和属性及使用
weixin_64615992的博客
03-13 1717
js节点的属性、获取（查找）、使用（创建、添加、删除、替换） `HTMLCollection` 与 `NodeList`
js节点属性（获取,设置）
weixin_44440256的博客
01-25 5800
节点属性的获取有三种方法 1. 对象.属性名 2. 对象[属性名] 3. obj.getAttribute(pro) &lt;img src="images/1.jpg" alt="" id="pic" class="one"&gt; &lt;script type="text/javascript"&gt; var txt=docum
js获取 元素 和 节点 大全
最新发布
2401_84094979的博客
05-06 622
自我介绍一下，小编13年上海交大毕业，曾经在小公司待过，也去过华为、OPPO等大厂，18年进入阿里一直到现在。深知大多数初中级Android工程师，想要提升技能，往往是自己摸索成长，自己不成体系的自学效果低效漫长且无助。因此收集整理了一份《2024年Web前端开发全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友，同时减轻大家的负担。既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，基本涵盖了95%以上Android开发知识点！
前端：获取当前节点属性值
qq_42782011的博客
01-10 368
var id = $(this).attr(“属性名称”);
JavaScript中节点获取，节点的属性，如何操作节点
weixin_45268910的博客
08-04 3093
任何 HTML 或 XML 文档都可以用 DOM 表示为一个由节点构成的层级结构。 一般来说在HTML中文档的节点分为三种： 1、元素节点 通过querySelector获取的节点就是元素节点 2、属性节点 通过getAttribute获取到的节点就是属性节点 3、文本节点 我们通过innerText获取到的就是文本节点 节点属性： nodeType节点类型 nodeN...
js获取属性节点
qq_43653914的博客
09-27 481
DOM 创建注释节点 let comEle = document.createComment("注释内容"); 获取和添加属性节点 获取属性节点的值 书写格式：元素节点.getAttribute(属性名) 例：let claValue = divELe.getAttribute("class"); 获取节点的类名 console.log(divELe.class);//un console.log(divELe.className);//box 注：由于class关键字，会冲突，因此获取类名用classN
示例4：操作节点属性.rar_javascript操作节点属性
09-20
1. **获取属性值**：使用`getAttribute()`方法可以获取节点的属性值。例如，`var attrValue = document.getElementById('myElement').getAttribute('myAttr');` 2. **设置属性值**：使用`setAttribute()`方法可以...
jQuery循环遍历子节点并获取值的方法
10-22
在jQuery中，我们可以使用`.children()`或`>`（直接子元素选择器）来选取子节点，使用`.each()`进行循环，使用`.find()`来查找特定的子元素，最后使用`.attr()`获取或设置属性值。 下面的JS代码展示了如何实现这个...
JavaScript获取select中text值的方法
10-20
在这个例子中，`this.value`获取的是选中项的`value`属性值，即`0`、`1`、`2`或`3`。而`this.options[this.selectedIndex].text`则获取的是对应的文本，如“家电”、“数码”或“服饰”。`selectedIndex`属性表示...
javascript动态修改Li节点值的方法
10-24
4. 理解并利用HTML的节点属性和类型，例如`nodeType`。 通过掌握这些技术，开发者可以构建更动态、更具交互性的网页应用，提升用户在浏览和使用网站时的体验。希望本文的介绍对你在JavaScript编程中实现类似功能...
兼容IE,firefox的获取节点的文本值的javascript代码
10-29
本文将探讨如何编写兼容IE和Firefox的JavaScript代码来获取节点的文本值。 首先，`innerHTML`属性是许多浏览器支持的一个特性，可以用来获取或设置一个元素内所有子节点的HTML内容。例如，对于以下HTML结构： ```...
JS--DOM节点对象，获取节点，节点属性，操作Dom节点，获取元素的偏移量，获取元素尺寸及综合练习
qq_63322025的博客
08-29 625
JS--DOM节点对象，获取节点，节点属性，操作Dom节点，获取元素的偏移量，获取元素尺寸及综合练习
js获取节点
lanjie_gunger的博客
03-22 559
当然了，首先DOM中有三种节点，元素节点，属性节点，文本节点 一、获取元素节点 document.getElementById(“xx”)//document对象的方法 document.getElementsByTagName(“li”);//Node接口的方法,根据元素本身的名字来获取 document.getElementsByName(“gender”);//根据元素的na
JS 之Node节点的 属性、方法 &获取
xiongfeng
10-22 2万+
JS Node节点的常见属性和方法使用 & 如何获取相应节点和值 一、节点的常用属性和方法 （一）通过具体的元素节点调用如下方法和属性 《1》getElementsByTagName() 方法，获取当前节点的指定标签名孩子节点 《2》appendChild(oNode) 方法给标签对象添加子节点。oNode是要添加的子节点。 《3》removeChild(oNode) removeChild方法删除子节
JS元素节点的一些属性和获取元素子节点的方法
wytccc的博客
11-01 299
node.nodeType、node.nodeName、node.nodeValue;childNodes、firstChild、lastChild、nextSibling、previousSibling、parentNode、children、firstElementChild、lastElementChild、nextElementSibling、previousElementSibling、parentElement
js中通过节点获取自定义属性
qq_39835505的博客
12-13 751
父标签，子标签 TObj = pNode.parent().next() .children(‘div’).children(’.title’); TObj = pNode.parent().parent().children(‘div’).children(’.title’); TObj = pNode.parent().children(‘div’).children(’.title’); /...
JavaScript获取节点的方法大全
qq_42889406的博客
10-26 1万+
1. 通过document节点获取 1.1 通过ID 语法：document.getElementById（“id”）； 特点： 应用场景： 推荐指数： 示例： 1.2 通过标签名 语法：document.getElementById（“id”）； 特点： 应用场景： 示例： 1.3 通过name值 语法：document.getElementById（“id”）； 特点： 应用场景： 示例： 1.4 通过class 语法：document.getElementById（“id”）； 特点： 应用场景： 示
JS获取元素属性和自定义属性
热门推荐
马优晨
09-14 16万+
昨天有同事问我，怎么获取自定义元素的属性，我意识到这个确实是个 问题，所有总结一下自己的心得。 获取元素的属性分为两种类型：1-获取元素常见的属性（class,id,type,value……）2-获取自定义的元素的属性（data-value,data-mess…….）获取元素的属性，设置元素的属性： 1-原生JS** 设置属性 .setAttribute("属性","值")
js获取、设置元素属性值
最初的梦想
07-25 1万+
文章目录setAttributegetAttributegetComputedStylecurrentStyle`元素.style.属性名` 网页css和样式结构 #box{ width:100px; height:100px; } <div id="box" style="background:red;"></div> setAttribute 元素...
antdv g6 获取节点属性
09-22
antdv是一个基于Ant Design设计语言的Vue组件库，而g6是一个图可视化引擎。在g6中，可以通过获取节点的属性来实现一些操作。下面是使用antdv和g6获取节点属性的方法。 在Vue组件中使用antdv的G6组件，可以通过以下步骤获取节点属性： 1. 在Vue组件中引入G6组件库： ```javascript import { Graph } from '@antv/g6'; ``` 2. 创建一个G6的Graph对象，并将其挂载到Vue的dom元素上： ```javascript const graph = new G6.Graph({ container: 'graph-container', ...其他配置项 }); ``` 3. 绑定节点点击事件，在点击节点时获取节点的属性： ```javascript graph.on('node:click', (event) => { const node = event.item; // 获取点击的节点对象 const nodeData = node.get('model'); // 获取节点的属性 // 打印节点的属性信息 console.log(nodeData); }); ``` 具体地说，通过`graph.on('node:click', callback)`可以监听节点的点击事件。在回调函数中，通过`event.item`获取点击的节点对象，并通过`node.get('model')`获取节点的属性值。可以根据需要对节点属性进行处理。 以上就是使用antdv和g6获取节点属性的方法。通过这种方式，我们可以在图可视化的过程中，根据节点的属性值来进行一些动态的操作。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值