js中的attribute详解
attributes:获取一个属性作为对象
getAttribute:获取某一个属性的值
setAttribute:建立一个属性,并同时给属性捆绑一个值
createAttribute:仅建立一个属性
removeAttribute:删除一个属性
getAttributeNode:获取一个节点作为对象
setAttributeNode:建立一个节点
removeAttributeNode:删除一个节点
attributes可以获取一个对象中的一个属性,并且作为对象来调用,注意在这里要使用“[]”,IE在这里可以使用“()”,考虑到兼容性的问题,要使用“[]”。关于attributes属性的使用方式上,IE和FF有巨大的分歧,在此不多介绍。
attributes的使用方法:(IE和FF通用)
<div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div>
</body>
<script>
var d = document.getElementById("sss").attributes["value"];
document.write(d.name);
document.write(d.value);
//显示value aaa
</script>
getAttribute,setAttribute,createAttribute,removeAttribute四兄弟的概念比较容易理解,使用方法也比较简单,唯一需要注意这几点:
1、createAttribute在使用的时候不需要基于对象的,document.createAttribute()就可以。
2、setAttribute,createAttribute在使用的时候如果是使用的时候不要使用name,type,value等单词,IE都FF的反应都奇怪的难以理解。
3、createAttribute在使用的时候如果只定义了名字,没有d.nodeValue = "hello";语句定义值,FF会认为是一个空字符串,IE认为是undefined,注意到这点就可以了。
getAttribute的使用方法:
<div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div>
</body>
<script>
var d = document.getElementById("sss").getAttribute("value");
document.write(d);
//显示 aaa
</script>
setAttribute的使用方法:(你会发现多了一个名为good的属性hello)
<div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div>
</body>
<script>
var d = document.getElementById("sss").setAttribute("good","hello");
alert(document.getElementById("t").innerHTML)
</script>
createAttribute的使用方法:(多了一个名为good的空属性)
<div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div>
</body>
<script>
var d = document.createAttribute("good");
document.getElementById("sss").setAttributeNode(d);
alert(document.getElementById("t").innerHTML)
</script>
removeAttribute的使用方法:(少了一个)
<div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div>
</body>
<script>
var d = document.getElementById("sss").removeAttribute("value");
alert(document.getElementById("t").innerHTML)
</script>
getAttributeNode,setAttributeNode,removeAttributeNode三个方法的特点是都直接操作一个node(节点),removeAttributeNode在一开始的时候总会用错,但是充分理解了node的含义的时候,就能够应用自如了。
getAttributeNode的使用方法:
<div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div>
</body>
<script>
var d = document.getElementById("sss").getAttributeNode("value");
document.write(d.name);
document.write(d.value);
//显示 value aaa
</script>
setAttributeNode的使用方法:
<div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div>
</body>
<script>
var d = document.createAttribute("good");
document.getElementById("sss").setAttributeNode(d);
alert(document.getElementById("t").innerHTML);
</script>
removeAttributeNode的使用方法:
<div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div>
</body>
<script>
var d = document.getElementById("sss").getAttributeNode("value")
document.getElementById("sss").removeAttributeNode(d);
alert(document.getElementById("t").innerHTML);
</script>
更多的关于attributes属必性问题,可在w3school中查询
js中的attribute详解相关推荐
- computed用发_Vue.js中computed使用详解
这次给大家带来Vue.js中computed使用详解,Vue.js中computed使用的注意事项有哪些,下面就是实战案例,一起来看一下. JS属性: JavaScript有一个特性是Object.d ...
- Js中apply方法详解说明
Js apply 方法 详解 我在一开始看到JavaScript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文章对apply方法和call的一些示例,总算是看的有点眉目了, ...
- JS中this关键字详解
本文主要解释在JS里面this关键字的指向问题(在浏览器环境下). 阅读此文章,还需要心平气和的阅读完,相信一定会有所收获,我也会不定期的发布,分享一些文章,共同学习 首先,必须搞清楚在JS里面,函数 ...
- JS中函数式编程详解版(FunctionalProgramming,FP)
函数式编程详解 函数式编程的认识 函数式编程前置知识 函数是一等公民(First-class Function) 高阶函数 闭包 函数式编程基础 纯函数 lodash 模块 柯里化 函数组合 函子 函 ...
- JS中的showModelDialog详解和实例
1.<a href="#" οnclick="SeePic('${list.PATH}')"><font color="blue&q ...
- JavaScript面向对象(一)——JS OOP基础与JS 中This指向详解
前 言 学过程序语言的都知道,我们的程序语言进化是从"面向机器".到"面向过程".再到"面向对象"一步步的发展而来.类似于汇编语言这样的面 ...
- Vue.js-Day01-PM【事件绑定(事件传参、事件对象、传参+获取事件对象)、样式处理操作(模板、事件、属性绑定)、Tab切换(原生js实现、Vue.js实现)、js中的this详解关键字】
Vue.js实训[基础理论(5天)+项目实战(5天)]博客汇总表[详细笔记] 目 录 4.事件绑定 4.1.事件绑定(点击.双击.鼠标移动) 点击按钮-最简单的事件绑定(无参函数) 格式 点击按钮 ...
- 【JS中scrollHeight/Width详解(不加定位的情况下)】
scrollHeight和scrollWidth的详解 一. 内容块Y轴上没有超出的情况下 二.内容块Y轴上有超出的情况下 2.1 当 overflow-y: visible的情况 2.2 设置ove ...
- JS中Location使用详解
javascript中 location用于获取或设置窗体的URL,并且可以用于解析URL,是BOM中最重要的对象之一,下面我们就来详细探讨下Location对象的使用. javascript中loc ...
最新文章
- 生态伙伴 | Worktile入驻飞书,助力企业轻松实现敏捷开发与协作
- 通过Soul看微内核架构(二)
- FD.io/VPP — VPP 的实现原理解析
- 《Android深度探索(卷1):HAL与驱动开发》——6.4节使用多种方式测试Linux驱动...
- 递归时间/空间复杂度的分析(斐波那契为例)
- hotspot 默认 gc_默认HotSpot最大直接内存大小
- Java基础——数组应用之StringBuilder类和StringBuffer类
- 服务器宕机监控、检测、报警程序(139绑定手机短信报警)monitor_down.sh
- 【Zabbix】Zabbix网络自动发现
- 关于数据库中的二维表是不是关系的判断
- Mysql 主键 联合主键 索引 唯一索引 被抠细节问死的问题
- 如何用计算机记英语词汇,计算机常用英语词汇大全
- 微信公众号:开发者工具下载、安装、使用
- 常用邮箱POP3 STMP服务器与端口号设置:
- Evading Defenses to Transferable Adversarial Examples by Translation-Invariant Attacks (翻译,侵删)
- 【MySQL】漫谈MySQL体系结构
- 取消参考文献自动编号_利用Word自动维护参考文献的编号和引用
- java开发微信如何维护登录状态_微信小程序中做用户登录与登录态维护的实现详解...
- 切图小贴士-手机Android平台“点九”的切图
- 棋盘覆盖问题C语言实现
热门文章
- 【Groovy】字符串 ( 字符串注入函数 | asBoolean | execute | minus )
- 【词汇】preci-词根、ap-前缀、de-前缀、ous-后缀、ify-后缀、ise-后缀
- html字符实体和实体名称 lt;
- NGINX的几个应用场景
- [转]docker 部署 mysql + phpmyadmin 3种方法
- java判断时间为上午,中午,下午,晚上,凌晨
- 【Redis】Redis学习(三) Redis 主从模式详解
- 最最简单的CentOs6在线源搭建
- iOS中正则表达式的基本使用方法
- JQuery选择器大全