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 相关文章推荐
JavaScript基础语法、dom操作树及document对象
Dec 02 Javascript
深入理解JavaScript编程中的原型概念
Jun 25 Javascript
把普通对象转换成json格式的对象的简单实例
Jul 04 Javascript
微信小程序之前台循环数据绑定
Aug 18 Javascript
基于jQuery ztree实现表格风格的树状结构
Aug 31 jQuery
layer ui插件显示tips时,修改字体颜色的实现方法
Sep 11 Javascript
javaScript把其它类型转换为Number类型
Oct 13 Javascript
使用 Angular RouteReuseStrategy 缓存(路由)组件的实例代码
Nov 01 Javascript
Javascript中的this,bind和that使用实例
Dec 05 Javascript
解决小程序无法触发SESSION问题
Feb 03 Javascript
基于Web Audio API实现音频可视化效果
Jun 12 Javascript
javascript递归函数定义和用法示例分析
Jul 22 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同时支持GIF、png、JPEG
2006/10/09 PHP
php桌面中心(一) 创建数据库
2007/03/11 PHP
站长助手-网站web在线管理程序 v1.0 下载
2007/05/12 PHP
Yii2第三方类库插件Imagine的安装和使用
2017/07/06 PHP
PHP耦合设计模式实例分析
2018/08/08 PHP
jQuery 位置插件
2008/12/25 Javascript
js 如何实现对数据库的增删改查
2012/11/23 Javascript
JS实现具备延时功能的滑动门菜单效果
2015/09/17 Javascript
dedecms页面如何获取会员状态的实例代码
2016/03/15 Javascript
JavaScript解八皇后问题的方法总结
2016/06/12 Javascript
第九篇Bootstrap导航菜单创建步骤详解
2016/06/21 Javascript
jquery获取table指定行和列的数据方法(当前选中行、列)
2016/11/07 Javascript
jQuery中table数据的值拷贝和拆分
2017/03/19 Javascript
微信小程序 flex实现导航实例详解
2017/04/26 Javascript
AugularJS从入门到实践(必看篇)
2017/07/10 Javascript
Vue.js通用应用框架-Nuxt.js的上手教程
2017/12/25 Javascript
JS+HTML5实现获取手机验证码倒计时按钮
2018/08/08 Javascript
微信小程序class封装http代码实例
2019/08/24 Javascript
Python3实现生成随机密码的方法
2014/08/23 Python
python网络编程之文件下载实例分析
2015/05/20 Python
python实现unicode转中文及转换默认编码的方法
2017/04/29 Python
全面分析Python的优点和缺点
2018/02/07 Python
Django中url的反向查询的方法
2018/03/14 Python
MAC平台基于Python Appium环境搭建过程图解
2020/08/13 Python
详解HTML5中表单验证的8种方法介绍
2016/12/19 HTML / CSS
HTML5 Canvas 旋转风车绘制
2017/08/18 HTML / CSS
计算机个人求职信范例
2014/01/24 职场文书
分公司任命书
2014/06/06 职场文书
小学领导班子对照材料
2014/08/23 职场文书
关于有小孩的离婚协议书
2014/10/26 职场文书
银行优秀员工推荐信
2015/03/24 职场文书
2015年体育部工作总结
2015/04/02 职场文书
2016国庆节活动宣传语
2015/11/25 职场文书
Python实现智慧校园自动评教全新版
2021/06/18 Python
php修改word的实例方法
2021/11/17 PHP
springboot+rabbitmq实现智能家居实例详解
2022/07/23 Java/Android