HTML 标签自定义属性的问题
2016-06-15 16:03
453 查看
HTML 标签里可以自定义属性,但要考虑到浏览器兼容性的问题。
写一段 HTML 代码如下:
在这个 <div> 标签里,我们自定义了一个属性 “myAttr” ,它的属性值为 “testAttr” 。如果定义一个属性却不使用它,那么这个属性是没有任何意义的。接下来我们在 JavaScript 里来调用这个属性:
经过测试,以上这段代码在所有浏览器里都有效。运行后会依次弹出 “testAttr” 和 "newAttr" 。
在 IE 5-8 里,以下代码也可以使用:
以上代码运行后会依次弹出 "testAttr" 和 "newAttr" 。
当然,使用 jQuery 也可以做到全部兼容:
);
自定义属性一般是我们用来存储数据或是相关依据的。根据实际情况,自定义属性其实是很有用的。
写一段 HTML 代码如下:
<div id='test' myAttr='testAttr'><div>
在这个 <div> 标签里,我们自定义了一个属性 “myAttr” ,它的属性值为 “testAttr” 。如果定义一个属性却不使用它,那么这个属性是没有任何意义的。接下来我们在 JavaScript 里来调用这个属性:
var test = document.getElementById(test); <pre name="code" class="html">alert(test.getAttribute('myAttr')); test.setAttribute('myAttr', 'newAttr')<pre name="code" class="javascript"><pre name="code" class="html">alert(test.getAttribute('myAttr'));
经过测试,以上这段代码在所有浏览器里都有效。运行后会依次弹出 “testAttr” 和 "newAttr" 。
在 IE 5-8 里,以下代码也可以使用:
var test = document.getElementById(test); <pre name="code" class="html">alert(test.myAttr); test.myAttr = 'newAttr'; alert(test.myAttr);
以上代码运行后会依次弹出 "testAttr" 和 "newAttr" 。
当然,使用 jQuery 也可以做到全部兼容:
alert( $("#test").attr("myAttr") ); <pre name="code" class="html">$("#test").attr("myAttr", "newAttr"); alert(<pre name="code" class="javascript"><pre name="code" class="html">$("#test").attr("myAttr")
);
自定义属性一般是我们用来存储数据或是相关依据的。根据实际情况,自定义属性其实是很有用的。
相关文章推荐
- HTMLTestRunner 错误日志显示问题
- HTML存储机制之WebStorage讲解
- html中button的立体效果圆角
- 第一章 HTML标记与文档结构 (HTML标记基础)
- 当遇到文本的颜色不一样时,可以使用html
- html浮动,相对,绝对布局
- 修改HTML元素
- tornadomail 发送html模板文件
- Html Learning Note from a beginner
- xhtml知识及head部分名词解
- xhtml知识及head部分名词解
- xhtml知识及head部分名词解
- html在线代码拼接工具
- 聊聊innerHTML
- IOError: No wkhtmltopdf executable found: ""
- CSDN博客里markdown中想引用html标签怎么添加?
- html——制作音乐盒
- html——新闻页面
- 解决Pyh中编写html出现乱码问题
- CWebBrowser2获取html的内容