HTML标签自定义属性(转)
HTML标签可以自定义属性
HTML标签可以自定义属性,但是我们要考虑其在IE、Firefox以及chrome下的兼容性问题。
例如:
- <div id="newTest" myAttr="getAttr"></div>
复制代码
这里的“myAttr”就是这个标签的自定义属性了。
如果定义了属性却使用不了,那么这个属性就没有任何意义了,接下来就是如何去调用我们的自定义属性的值了。
在IE浏览器里,我们通过获取对象后直接调用就可以了
- document.getElementById("newTest").myAttr;
复制代码
在IE浏览器里,我们同样可以对其直接赋值而动态产生一个自定义属性:
- document.getElementById("newTest").newAttr = "new";
复制代码
在火狐和谷歌浏览器里,我们可以通过getAttribute方法来实现调用:
- document.getElementById("newTest").getAttribute("myAttr");
复制代码
在火狐和谷歌浏览器里,我们可以通过setAttribute方法在产生并设置一个自定义属性:
- document.getElementById("newTest").setAttribute("newAttr","new");
复制代码
自定义属性一般是我们用来存储数据或是相关依据的,根据实际情况,自定义属性其实很有用的。
测试浏览器:IE8,firefox 8.01,chrome 17.0.963.46 m
测试结果:能够获取到自定义属性
另外补充一点,如果不想做兼容判断,其实我们可以使用Jquery的attr方法来获取与设置自定义属性的值,目前测试结果是全兼容。
- $("#newTest").attr("myAttr");
- $("#newTest").attr("newAttr","new");
HTML标签自定义属性(转)的更多相关文章
- HTML自定义标签与标签自定义属性
大部分浏览器支持自定义HTML标签和为标准标签自定义属性,而且很多浏览器对这两种自定义行为的支持都很直接了当. 自定义HTML标签 在firefox.chrome这种现代浏览器里,自定义标签很简单,就 ...
- Thymeleaf 之 内置对象、定义变量、URL参数及标签自定义属性
Thymeleaf 之 内置对象.定义变量.URL参数及标签自定义属性 本文章来自[知识林] 如标题所述,这篇文章主要讲述Thymeleaf中的内置对象(list解析.日期格式化.数字格式化等).定义 ...
- 获取当前html标签自定义属性的值
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...
- Jquery学习笔记: attr和 prop的区别,以及为html标签自定义属性
一.自定义html标签属性 对于html文件中的html标签,可以自定义属性,如: <a href="#" id="link1" action=" ...
- HTML标签自定义属性
本文章转载至:http://www.cnblogs.com/luoyanli/archive/2012/10/17/2727886.html HTML标签可以自定义属性,但是我们要考虑其在IE.Fir ...
- 如何获取Input标签自定义属性的值?
HTML代码: <input type="hidden" value="${Name?if_exists}" id='ID' busCode = &quo ...
- js原生图片懒加载 或 js原生图片预加载,html标签自定义属性
使用原声js来实现图片预加载,或图片懒加载,小伙伴们可以根据项目需要来结合vue或者是react来进行修改. 一.什么是图片懒加载或什么是图片预加载 当访问一个页面的时候,先把img元素或是其他元素的 ...
- JQUERY获取html标签自定义属性值或data值
//获取属性值 1 <div id="text" value="黑哒哒的盟友"><div> jQuery取值: $("#tex ...
- 工作总结 获取html 标签 自定义属性值 根据html 自定义属性 获取 到标签
FFID HFID function getElementByAttr(tag, attr, value) { var aElements = document.getElementsByTag ...
随机推荐
- 2-SAT开坑
Reference:http://blog.csdn.net/jarjingx/article/details/8521690 其中伍昱的ppt不错. 2SAT最裸的模型: 一国有n个党派,每个党派在 ...
- easyui 动态修改窗口title
http://blog.csdn.net/liu251890347/article/details/39292307?utm_source=tuicool 使用easyui作为前台框架极大的节省了项目 ...
- NSThread - (void)start vs java Thread implements Runnable
This method spawns the new thread and invokes the receiver’s main method on the new thread. If you i ...
- iOS欢迎界面Launch Screen动态加载广告
有许多应用程序在打开的时候,欢迎界面会加载一张连网获取的广告图片或者显示一组动画,这样的效果是如何做到的呢?下面给大家介绍一种简单的实现加载广告的方式. 程序运行起来,欢迎界面之后,会进入AppDel ...
- (转)win32Application和win32ApplicationConsole
这几天在创建MFC项目时,常常遇到一下两个连接错误,例如: 1. LIBCD.lib(crt0.obj) : error LNK2001: unresolved external symbol _ma ...
- Entity Framework 系统约定配置
前言 Code First之所以能够让开发人员以一种更加高效.灵活的方式进行数据操作有一个重要的原因在于它的约定配置.现在软件开发越来越复杂,大家都试图将软件设计的越来越灵活,很多内容我们都希望是可配 ...
- 草根玩微博 中产玩微信 土豪玩什么?支持Yo的iWatch?
<中国新媒体发展报告(2014)>发布了一些新媒体的使用情况数据,25.6%无收入群体人数在玩微博,32.0%的微信用户属于月收入3000~5000元的中产阶层,那么土豪会玩什么新媒体呢? ...
- java笔记--关于线程死锁
关于线程死锁 什么是死锁: 在编写多线程的时候,必须要注意资源的使用问题,如果两个或多个线程分别拥有不同的资源, 而同时又需要对方释放资源才能继续运行时,就会发生死锁. 简单来说:死锁就是当一个或多个 ...
- js实现鼠标右键自定义菜单(弹出层),并与树形菜单(TreeView)、iframe合用(兼容IE、Firefox、Chrome)
<table class="oa-el-panel-tree"> <tr> <td style="vertical-align: top; ...
- NSArray和NSMutableArray
//1. NSArray EOItems *eOItems = [[EOItems alloc] init]; eOItems.ID = [NSNumber numberWithInt:]; NSAr ...