JavaScript变量Dom对象的所有属性


Posted in Javascript onApril 30, 2020

DOM对象的HTML:

<button>Disable State</buttom>

1,遍历DOM对象所具有的属性(全部,不管是否在HTML tag中是否设置)

<!DOCTYPE html>
<html>

<body>
  <button id="btnToggleState" onclick="toggleStateManagement()">
      Disable State
  </button>
</body>
<script>
  var obj = document.getElementById("btnToggleState");
  var s = "";
  for (var elem in obj) {
    s += elem + "\n";
  }
  alert(s);
</script>
</html>

结果:

JavaScript变量Dom对象的所有属性

2.遍历DOM对象在HTML中设置过的属性:

每一个attribute属性有一个附加属性specified,当属性是HTML Element的属性(指写在代码中可见的),或者是通过setAttribute方法进行的添加的时候,它的值为 true。

<!DOCTYPE html>
<html>

<body>
  <button id="btnToggleState" onclick="toggleStateManagement()">
      Disable State
    </button>
</body>
<script>
  // var obj = document.getElementById("btnToggleState");
  // var s = "";
  // for (var elem in obj) {
  //   s += elem + "\n";
  // }
  // alert(s);


  var obj = document.getElementById("btnToggleState");
  var pairs = new Array();
  for (var i = 0, len = obj.attributes.length; i < len; i++) {
    var name = obj.attributes[i].nodeName;
    var value = obj.attributes[i].nodeValue;
    if (obj.attributes[i].specified) {
      pairs.push(name + "=\' " + value + "\' ")
    }
  }
  alert(pairs);
</script>

</html>

结果如下:

JavaScript变量Dom对象的所有属性

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
网页常用特效代码整理
Jun 23 Javascript
Prototype 工具函数 学习
Jul 23 Javascript
JavaScript 学习笔记(五)
Dec 31 Javascript
jQuery EasyUI Dialog拖不下来如何解决
Sep 28 Javascript
JS表单验证的代码(常用)
Apr 08 Javascript
Angular页面间切换及传值的4种方法
Nov 04 Javascript
JavaScript中校验银行卡号的实现代码
Dec 19 Javascript
jQuery实现Table表格隔行变色及高亮显示当前选择行效果示例
Feb 14 Javascript
React入门教程之Hello World以及环境搭建详解
Jul 11 Javascript
详解JS中的this、apply、call、bind(经典面试题)
Sep 19 Javascript
jQuery实现IE输入框完成placeholder标签功能的方法
Sep 20 jQuery
Bootstrap table使用方法汇总
Nov 17 Javascript
vue项目中使用bpmn为节点添加颜色的方法
Apr 30 #Javascript
VSCode搭建Vue项目的方法
Apr 30 #Javascript
jQuery实现的解析本地 XML 文档操作示例
Apr 30 #jQuery
vue使用map代替Aarry数组循环遍历的方法
Apr 30 #Javascript
jQuery事件模型默认行为执行顺序及trigger()与 triggerHandler()比较实例分析
Apr 30 #jQuery
JS XMLHttpRequest原理与使用方法深入详解
Apr 30 #Javascript
Vue中通过属性绑定为元素绑定style行内样式的实例代码
Apr 30 #Javascript
You might like
php学习笔记 数组遍历实现代码
2011/06/09 PHP
ThinkPHP模板引擎之导入资源文件方法详解
2014/06/18 PHP
php实现对两个数组进行减法操作的方法
2015/04/17 PHP
CodeIgniter连贯操作的底层原理分析
2016/05/17 PHP
mysql desc(DESCRIBE)命令实例讲解
2016/09/24 PHP
很可爱的输入框
2008/08/03 Javascript
使用jQuery全局事件ajaxStart为特定请求实现提示效果的代码
2010/12/30 Javascript
基于KMP算法JavaScript的实现方法分析
2013/05/03 Javascript
浅析JavaScript中的隐式类型转换
2013/12/05 Javascript
Javascript核心读书有感之表达式和运算符
2015/02/11 Javascript
理解JavaScript中Promise的使用
2016/01/18 Javascript
jQuery Validation Plugin验证插件手动验证
2016/01/26 Javascript
JS实现向iframe中表单传值的方法
2017/03/24 Javascript
nodejs实现的简单web服务器功能示例
2018/03/15 NodeJs
编写一个javascript元循环求值器的方法
2020/04/14 Javascript
将Emacs打造成强大的Python代码编辑工具
2015/11/20 Python
解决pycharm每次新建项目都要重新安装一些第三方库的问题
2019/01/17 Python
pandas数据集的端到端处理
2019/02/18 Python
python中栈的原理及实现方法示例
2019/11/27 Python
Python实现投影法分割图像示例(二)
2020/01/17 Python
使用pygame编写Flappy bird小游戏
2020/03/14 Python
pandas to_excel 添加颜色操作
2020/07/14 Python
CSS3移动端vw+rem不依赖JS实现响应式布局的方法
2019/01/23 HTML / CSS
HTML5获取当前地理位置并在百度地图上展示的实例
2020/07/10 HTML / CSS
在数据文件自动增长时,自动增长是否会阻塞对文件的更新
2014/05/01 面试题
企业行政文员岗位职责
2013/12/03 职场文书
小学生环保演讲稿
2014/04/25 职场文书
党员教师群众路线对照检查材料思想汇报
2014/09/29 职场文书
群众路线专项整治方案
2014/10/27 职场文书
2015年万圣节活动总结
2015/03/24 职场文书
2015年电话销售工作总结范文
2015/04/20 职场文书
盗窃罪辩护词范文
2015/05/21 职场文书
2016八一建军节慰问信
2015/11/30 职场文书
nginx location优先级的深入讲解
2021/03/31 Servers
高考要来啦!用Python爬取历年高考数据并分析
2021/06/03 Python
HTML+CSS实现导航条下拉菜单的示例代码
2021/08/02 HTML / CSS