1.removeAttribute() 方法删除指定的属性。

注：removeAttributeNode() 方法从元素中删除指定的属性节点。
简单的来讲，removeAttribute() 移除元素内的属性；

<style>

  .aaa{

    color:red;

  }

</style>

</head>

<body>

  <h1 class="aaa">Hello World</h1>

  <button onclick="myFunction()">点击</button>

  <script>

  function myFunction()

  {

  document.getElementsByTagName("h1")[0].removeAttribute("class");     //当点击的时候，h1的红色会变成黑色（默认黑色）应为移除了class这个属性

  }

  </script>

</body>

2.getAttribute() 方法通过名称获取属性的值。（属性不存在时返回null）

注：getAttributeNode() 方法从当前元素中通过名称获取属性节点。

<style>

    .aaa{

      color:red;

    }

</style>

</head>

<body>

  <h1 class="aaa">Hello World</h1>

  <button onclick="myFunction()">点击</button>

  <script>

    function myFunction()

    {

    var h1=document.getElementsByTagName("h1")[0];

    alert(h1.className);                    //两者都能有效果    aaa

    alert(h1.getAttribute("class"));      //             aaa

    }

  </script>

 </body>

获取 dom 节点数据请不要用其他方法，统一用getattribute，获取对象属性方括号是兼容性最广的，点号方便，但是低版本 ie 有兼容性问题。良好的编程习惯是减少bug的保证

3.setAttribute() 方法添加指定的属性，并为其赋指定的值。

*注意：如果这个指定的属性已存在，则仅设置/更改值。
和getAttribute一样，setAttribute只是用于元素节点
*

<body>

  <input value="OK">

  <p>点击按钮来设置按钮的 type 属性。</p>

  <button onclick="myFunction()">点击</button>

  <script>

    function myFunction()

    {

    document.getElementsByTagName("input")[0].setAttribute("type","button");

    }

  </script>

</body>

Internet Explorer 8 以及更早的版本不支持此方法。

通过setAttribute对文档做出修改后，在通过浏览器的源代码查看时看到的仍然是改变前的属性值。这种“表里不一”的现象源自DOM的工作模式：先加载文档的静态内容，在动态刷新，动态刷新不影响文档的静态内容。

                                                      -DOM编程艺术

removeAttribute getAttribute setAttribute的更多相关文章

  1. 认识 getAttribute() setAttribute()

    getAttribute()方法不属于document对象,所以不能通过document对象调用,它只能通过元素节点对象调用 var paras = document.getElementsByTag ...

  2. setAttribute()方法和 getAttribute() 方法

    一.setAttribute() 方法 setAttribute() 方法为一个或一组元素添加指定的属性,并且为其赋指定的值.(主要针对自定义属性) 如果这个属性已经存在,仅仅设置或是修改属性值. 浏 ...

  3. JavaScript中.、[]与setAttribute()在设置属性上的区别

    .和[] javaScript.和[]既可以对所有js对象设置属性,但是对于DOM对象它设置的属性有些特殊.对于元素DOM标准属性,实现属性值的设置/更改;对于元素DOM非标准属性,仅在js中有效,在 ...

  4. javascript 中 dom.getAttribute("value") 与dom.value的差异

    dom 是一个 input type="text" 手动修改 input 的值, 使用 dom.getAttribute("value") 只能得到 html ...

  5. jQuery 2.0.3 源码分析 钩子机制 - 属性操作

    jQuery提供了一些快捷函数来对dom对象的属性进行存取操作. 这一部分还是比较简单的. 根据API这章主要是分解5个方法 .attr()   获取匹配的元素集合中的第一个元素的属性的值  或 设置 ...

  6. 公司内部的一篇关于dom方法的分享

    第一部分 dom node类型 nodeType 属性 nodeType 属性返回节点的类型.nodeType 是只读的. 比较重要的节点类型有: 元素类型 NodeType 元素 1 属性 2 文本 ...

  7. servlet学习笔记_3

    一.路径问题如果是在浏览器端请求服务器的数据(超链接,js的src),那么加/代表在Tomcat的webapp目录,不加/的话通常不考虑,实际上不加/在浏览器端也是当前项目目录(但是开发中通常必须要写 ...

  8. Js杂谈-DOM

    前言 对jQuery的依赖.导致js的原生方法的淡忘,如果是封装自己的库,那势必要用到js的许多原生方法.从Jquery强大的dom处理开始,我们开始回顾javascript那些古老而坚挺的DOM方法 ...

  9. DOM Element节点类型详解

    上文中我们讲解了 DOM 中最重要的节点类型之一的 Document 节点类型,本文我们继续深入,谈谈另一个重要的节点类型 Element . 1.概况 Element 类型用于表现 HTML 或 X ...

随机推荐

  1. 对象数组和for循环遍历输出学生的信息

    public class Student { private int no; private String name; private int age; public Student(int no, ...

  2. Mysql计算时间最近多久

    -- DATE_SUB(CURDATE(), INTERVAL 3 MONTH)计算结果为当前时间的前推三个月,time字段可为时间型字符串 select * form t_user where ti ...

  3. bind() 方法

    一. 定义和用法 bind() 方法为被选元素添加一个或多个事件处理程序,并规定事件发生时运行的函数. 语法: $(selector).bind(event,data,function) 举例:  

  4. Linux 设置开机启动项的几种方法

    方法一:编辑rc.loacl脚本 Ubuntu开机之后会执行/etc/rc.local文件中的脚本. 所以我们可以直接在/etc/rc.local中添加启动脚本. $ vim /etc/rc.loca ...

  5. Idea mac

    Idea 的破解 http://idea.lanyus.com/ Idea 的常用配置 模版及模版的使用 创建 JavaWeb 或 Module 关联数据库 版本控制 断点调试 配置 maven 其他 ...

  6. spring-mvc基于注解的配置

    将配置文件修改为: <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="htt ...

  7. iOS简单音乐实现、React-Native完整项目、仿闲鱼京东列表分页、语音识别、网络加载过度动画等源码

    iOS精选源码 iOS快速入手语音识别.听写.评测.播报 网络加载数据的过渡动画(仿简书网页) iOS 封装跑马灯和轮播效果 crash防护组件,适用常见常用的数组,字典等crash保护 iOS:高仿 ...

  8. django项目总结_20191128

    django项目总结_20191128 ##################### 1,这个项目分为四个部分: 用户模块 商品模块 购物车模块 订单模块 2,这个项目用到的技术: redis cele ...

  9. 3dmax2020卸载/安装失败/如何彻底卸载清除干净3dmax2020注册表和文件的方法

    3dmax2020提示安装未完成,某些产品无法安装该怎样解决呢?一些朋友在win7或者win10系统下安装3dmax2020失败提示3dmax2020安装未完成,某些产品无法安装,也有时候想重新安装3 ...

  10. jmeter压测遇到的问题

    一.今天压力测试时,开始12秒后出现了很多异常, 都是 java.net.NoRouteToHostException: Cannot assign requested address. 1.首先我这 ...