DOM对象对于js来说,是个很基础的元素,我们写js一般来说,都一定会对它进行操作。我们可以很方便地给它加上自定义的属性,比如:

  var test = document.getElementById("test");

  test.adang = "adang";

  alert(test.adang);

  我们会发现,已经给这个id为test的DOM元素添加了一个叫做adang的属性了,然后在js中,可以调用这个属性。我在写js的时候经常用到这种方法,可以很方便地对某个dom对象添加一些特殊的数据,感觉DOM对象就像一个很好用的容器,可以放一堆数据进去。

  进一步想到一个问题,这些属性可以在js中添加,那么是否可以像flex一样,在标签中添加呢?事实上,像id啊,src啊这样的属性,都是可以在js中添加,也可以在标签上添加的,两种方式js都可以获取数据。这里要说一点,class比较特殊,标签中用的是class,在js中调用却要用className才行。

  像id啊,title,src此类html中支持的属性,可以在标签中设置,然后js访问。

关于JS读取DOM对象(标签)的自定义属性的更多相关文章

  1. js的DOM对象

    1.js的Array对象           ** 创建数组(三种)                          - var arr1 = [1,2,3];                    ...

  2. JavaScript基础15——js的DOM对象

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  3. js的dom对象(带实例超详细全解)

    js的dom对象(带实例超详细全解) 一.总结 一句话总结: 1.DOM中的方法区分大小写么? 解答:区分 2.DOM中元素和节点的关系式什么? 解答:元素就是标签,节点中有元素节点,也是标签,节点中 ...

  4. 前端之JavaScript:JS之DOM对象二

    继续JS之DOM对象二 前面在JS之DOM中我们知道了属性操作,下面我们来了解一下节点操作.很重要!! 一.节点操作 创建节点:var ele_a = document.createElement(' ...

  5. 前端之JavaScript:JS之DOM对象一

    js之DOM对象一 一.什么是HTML  DOM HTML  Document Object Model(文档对象模型) HTML DOM 定义了访问和操作HTML文档的标准方法 HTML DOM 把 ...

  6. jQuery对象与JS原生dom对象之间的转换

    jQuery就是JS的一个扩展库,工具库,提供很多方便快捷的方法,所以将JS对象转换为jQuery对象后,能更方便地操作这个对象.但是jQuery对象也不是万能的,有一些JS对象有的能,jQuery对 ...

  7. js操作DOM对象

    js操作DOM对象  (Document Object Model)文档对象模型 nodeType返回值 1:元素节点 2:属性节点 3:文本节点 8:注释节点 9: 文档节点 nodeName 节点 ...

  8. 前端之JavaScript:JS之DOM对象三

    js之DOM对象三   一.JS中for循环遍历测试 for循环遍历有两种 第一种:是有条件的那种,例如    for(var i = 0;i<ele.length;i++){} 第二种:for ...

  9. JS BOM DOM对象 select联动 计时器 时间 css操作 节点(标签 ) 查找标签 {前端基础之BOM和DOM}

    前端基础之BOM和DOM 前戏 到目前为止,我们已经学过了JavaScript的一些简单的语法.但是这些简单的语法,并没有和浏览器有任何交互. 也就是我们还不能制作一些我们经常看到的网页的一些交互,我 ...

随机推荐

  1. Ubuntu TTy字体

    目的:修改tty终端下的字体大小,中文显示,字体美观问题 Linux版本:xubuntu14.04 当切换到tty终端模式式,中文乱码,且字体太小,影响阅读.在网上搜了一些资料,将问题及解决方案记录如 ...

  2. springcloud费话之断路器(hystrix in feign)

    目录: springcloud费话之Eureka基础 springcloud费话之Eureka集群 springcloud费话之Eureka服务访问(restTemplate) springcloud ...

  3. 工作流引擎 springmvc SSM 流程审批 Java Activiti 后台框架源码

    工作流模块  1.模型管理    :web在线流程设计器.预览流程xml.导出xml.部署流程 2.流程管理    :导入导出流程资源文件.查看流程图.根据流程实例反射出流程模型.激活挂起 3.运行中 ...

  4. 记一次redis读取超时的排查过程(SADD惹的祸)

    问题背景 在业务使用redis过程中,出现了read timeout 的异常. 问题排查 直接原因 运维查询redis慢查询日志,发现在异常时间节点,有redis慢查询日志,执行sadd 命令花费了1 ...

  5. Nginx环境部署

    下载Nginx wget nginx.tar.gz http://nginx.org/download/nginx-1.17.1.tar.gz 解压源码 tar -zxvf nginx-1.17.1. ...

  6. bzoj4898 & loj2308 [Apio2017]商旅 最短路+01分数规划

    题目传送门 https://lydsy.com/JudgeOnline/problem.php?id=4898 https://loj.ac/problem/2308 题解 发现我们可以把整个环路分成 ...

  7. bzoj4489 [Jsoi2015]地铁线路 最短路

    题目传送门 https://lydsy.com/JudgeOnline/problem.php?id=4489 题解 感觉又被骗了.看这道题的 AC 人数不多,以为是一道很好的题目.结果发现是一个非常 ...

  8. BZOJ2839 集合计数 二项式反演

    题目传送门 https://lydsy.com/JudgeOnline/problem.php?id=2839 题解 二项式反演板子题. 类似于一般的容斥,我们发现恰好 \(k\) 个不怎么好求,但是 ...

  9. SDOI2018凉凉记

    好久没有更博客了...因为我在颓废学习.. SDOI一轮结束了...我也该回来学地生了... 凉凉 ————————————————我是分割线———————————————— Day0 愉快感冒的Da ...

  10. 单例设计模式(Singleton)的优化

    单例模式的优化 单例模式懒汉式写法,单例模式的优化有以下四个方面: 使用同步保证线程安全synchronized 使用volatile关键字:volatile关键字提醒编译器后面所定义的变量随时都有可 ...