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 相关文章推荐
jQuery参数列表集合
Apr 06 Javascript
jQuery对表单的操作代码集合
Apr 06 Javascript
javaScript array(数组)使用字符串作为数组下标的方法
Nov 19 Javascript
js实现局部页面打印预览原理及示例代码
Jul 03 Javascript
JavaScript中document对象使用详解
Jan 06 Javascript
基于jquery实现表格内容筛选功能实例解析
May 09 Javascript
Vue方法与事件处理器详解
Dec 01 Javascript
angular.js实现购物车功能
Oct 23 Javascript
用Axios Element实现全局的请求loading的方法
Mar 15 Javascript
js+canvas实现验证码功能
Sep 21 Javascript
详解Vue-axios 设置请求头问题
Dec 06 Javascript
js实现跳一跳小游戏
Jul 31 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
终于听上了直流胆调频
2021/03/02 无线电
php数组函数序列之in_array() 查找数组值是否存在
2011/10/29 PHP
php.ini修改php上传文件大小限制的方法详解
2013/06/17 PHP
ThinkPHP实现二级循环读取的方法
2014/11/03 PHP
PHP实现的常规正则验证helper公共类完整实例
2017/04/27 PHP
浅析PHP数据导出知识点
2018/02/17 PHP
PHP二维数组分页2种实现方法解析
2020/07/09 PHP
jquery 操作DOM的基本用法分享
2012/04/05 Javascript
JS、CSS加载中的小问题探讨
2013/11/26 Javascript
js类型转换与引用类型详解(Boolean_Number_String)
2014/03/07 Javascript
jquery解析xml字符串简单示例
2014/04/11 Javascript
PHP+jQuery+Ajax实现多图片上传效果
2015/03/14 Javascript
一览画面点击复选框后获取多个id值的方法
2016/05/30 Javascript
Vue.js 表单校验插件
2016/08/14 Javascript
基于jQuery实现火焰灯效果导航菜单
2017/01/04 Javascript
详解JS异步加载的三种方式
2017/03/07 Javascript
JS对象的深度克隆方法示例
2017/03/16 Javascript
angular.js中解决跨域问题的三种方式
2017/07/12 Javascript
用nodejs实现json和jsonp服务的方法
2017/08/25 NodeJs
React Native使用百度Echarts显示图表的示例代码
2017/11/07 Javascript
React Native 自定义下拉刷新上拉加载的列表的示例
2018/03/01 Javascript
使用Angular CLI生成路由的方法
2018/03/24 Javascript
如何在Vue.js中实现标签页组件详解
2019/01/02 Javascript
详解基于electron制作一个node压缩图片的桌面应用
2019/01/29 Javascript
vue移动端城市三级联动组件使用详解
2019/07/26 Javascript
JS实现容器模块左右拖动效果
2020/01/14 Javascript
vue axios请求成功却进入catch的原因分析
2020/09/08 Javascript
JavaScript实现雪花飘落效果
2020/12/27 Javascript
[01:13:08]2018DOTA2亚洲邀请赛4.6 淘汰赛 mineski vs LGD 第二场
2018/04/10 DOTA
flask框架中勾子函数的使用详解
2018/08/01 Python
浅谈python脚本设置运行参数的方法
2018/12/03 Python
Python格式化字符串f-string概览(小结)
2019/06/18 Python
The North Face北面法国官网:美国著名户外品牌
2019/11/01 全球购物
促销活动方案模板
2014/02/24 职场文书
2015年英语教师工作总结
2015/05/20 职场文书
村官2015年度工作总结
2015/10/14 职场文书