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 相关文章推荐
JS实现遮罩层效果的简单实例
Nov 12 Javascript
编写高效jQuery代码的4个原则和5个技巧
Apr 24 Javascript
Javascript中的作用域和上下文深入理解
Jul 03 Javascript
酷炫jQuery全屏3D焦点图动画效果
Mar 22 Javascript
原生JS实现网络彩票投注效果
Sep 25 Javascript
BootStrap实现手机端轮播图左右滑动事件
Oct 13 Javascript
关于在vue-cli中使用微信自动登录和分享的实例
Jun 22 Javascript
node简单实现一个更改头像功能的示例
Dec 29 Javascript
layer弹出层 iframe层去掉滚动条的实例代码
Aug 17 Javascript
基于node.js实现爬虫的讲解
Feb 18 Javascript
layui table表格数据的新增,修改,删除,查询,双击获取行数据方式
Nov 14 Javascript
vue实现评价星星功能
Jun 30 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上传apk后自动提取apk包信息的使用(示例下载)
2013/04/26 PHP
学习php设计模式 php实现模板方法模式
2015/12/08 PHP
PHP使用星号隐藏用户名,手机和邮箱的实现方法
2016/09/22 PHP
PHP全功能无变形图片裁剪操作类与用法示例
2017/01/10 PHP
利用javascript/jquery对上传文件格式过滤的方法
2009/07/25 Javascript
Node.js异步I/O学习笔记
2014/11/04 Javascript
JavaScript判断表单中多选框checkbox选中个数的方法
2015/08/17 Javascript
js实现二级菜单渐隐显示
2015/11/03 Javascript
给angular加上动画效遇到的问题总结
2016/02/17 Javascript
javacript获取当前屏幕大小
2016/06/04 Javascript
JavaScript比较当前时间是否在指定时间段内的方法
2016/08/02 Javascript
jquery文字填写自动高度的实现方法
2016/11/07 Javascript
两种简单的跨域方法(jsonp、php)
2017/01/02 Javascript
原生js实现瀑布流布局
2017/03/08 Javascript
原生js实现放大镜特效
2017/03/08 Javascript
Bootstrap实现基于carousel.js框架的轮播图效果
2017/05/02 Javascript
js canvas实现QQ拨打电话特效
2017/05/10 Javascript
vue使用drag与drop实现拖拽的示例代码
2017/09/07 Javascript
JavaScript面向对象精要(上部)
2017/09/12 Javascript
Bootstrap3.3.7导航栏下拉菜单鼠标滑过展开效果
2017/10/31 Javascript
3种vue组件的书写形式
2017/11/29 Javascript
Element UI 自定义正则表达式验证方法
2018/09/04 Javascript
Vuex的实战使用详解
2019/10/31 Javascript
Vue实现腾讯云点播视频上传功能的实现代码
2020/08/17 Javascript
[45:10]NB vs Liquid Supermajor小组赛 A组胜者组决赛 BO3 第二场 6.2
2018/06/04 DOTA
使用Python的urllib和urllib2模块制作爬虫的实例教程
2016/01/20 Python
老生常谈python之鸭子类和多态
2017/06/13 Python
python调用外部程序的实操步骤
2019/03/04 Python
OpenCV+face++实现实时人脸识别解锁功能
2019/08/28 Python
基于Python执行dos命令并获取输出的结果
2019/12/30 Python
Nginx+Uwsgi+Django 项目部署到服务器的思路详解
2020/05/08 Python
2014年圣诞节促销方案
2014/03/14 职场文书
开服装店计划书
2014/08/15 职场文书
教师节慰问信
2015/02/15 职场文书
2016大一新生军训感言
2015/12/08 职场文书
导游词之海南天涯海角
2019/12/05 职场文书