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代码示例(重构前后对比)
Jan 23 Javascript
用Javascript来生成ftp脚本的小例子
Jul 03 Javascript
JS对HTML标签select的获取、添加、删除操作
Oct 17 Javascript
Javascript中Array.prototype.map()详解
Oct 22 Javascript
JavaScript中join()方法的使用简介
Jun 09 Javascript
纯javascript实现四方向文本无缝滚动效果
Jun 16 Javascript
JavaScript 经典实例日常收集整理(常用经典)
Mar 30 Javascript
jQuery实现立体式数字滚动条增加效果
Dec 21 Javascript
Vue2 配置 Axios api 接口调用文件的方法
Nov 13 Javascript
微信小程序 wepy框架与iview-weapp的用法详解
Apr 10 Javascript
微信小程序实现渐入渐出动画效果
Jun 13 Javascript
聊聊JS ES6中的解构
Apr 29 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
怎么使 Mysql 数据同步
2006/10/09 PHP
php生成二维码的几种方式整理及使用实例
2013/06/03 PHP
基于PHP文件操作的详细诠释
2013/06/21 PHP
php三维数组去重(示例代码)
2013/11/26 PHP
php二维码生成
2015/10/19 PHP
PHP 7.1中AES加解密方法mcrypt_module_open()的替换方案
2017/10/17 PHP
PHP实现的猴王算法(猴子选大王)示例
2018/04/30 PHP
php使用event扩展的io复用测试的示例
2020/10/20 PHP
js验证表单大全
2006/11/25 Javascript
神奇的代码 通杀各种网站-可随意修改复制页面内容
2008/07/17 Javascript
jQuery学习笔记 获取jQuery对象
2012/09/19 Javascript
jquery submit ie6下失效的原因分析及解决方法
2013/11/15 Javascript
bootstrap选项卡使用方法解析
2017/01/11 Javascript
bootstrap响应式表格实例详解
2017/05/15 Javascript
AngularJS使用ocLazyLoad实现js延迟加载
2017/07/05 Javascript
BootStrap selectpicker后台动态绑定数据的方法
2017/07/28 Javascript
webpack4 处理SCSS的方法示例
2018/09/03 Javascript
vue-cli脚手架build目录下utils.js工具配置文件详解
2018/09/14 Javascript
JavaScript实现简单随机点名器
2019/11/21 Javascript
详细分析Node.js 模块系统
2020/06/28 Javascript
[46:58]完美世界DOTA2联赛PWL S3 Forest vs LBZS 第一场 12.17
2020/12/19 DOTA
Python2.7编程中SQLite3基本操作方法示例
2017/08/09 Python
windows下pycharm安装、创建文件、配置默认模板
2018/07/31 Python
12个Python程序员面试必备问题与答案(小结)
2019/06/24 Python
python 负数取模运算实例
2020/06/03 Python
Marc Jacobs官方网站:美国奢侈品牌
2017/08/29 全球购物
美国女士内衣在线折扣商店:One Hanes Place
2019/03/24 全球购物
.NET remoting中对象激活的两种方式
2015/06/08 面试题
普通大学毕业生自荐信
2013/11/04 职场文书
仓库管理制度
2014/01/21 职场文书
装饰活动策划方案
2014/02/11 职场文书
2014年仓库工作总结
2014/11/20 职场文书
幼儿园毕业致辞
2015/07/29 职场文书
2016应届毕业生自荐信范文
2016/01/28 职场文书
《蟋蟀的住宅》教学反思
2016/02/17 职场文书
《月歌。》宣布制作10周年纪念剧场版《RABBITS KINGDOM THE MOVIE》
2022/04/02 日漫