html data 元素标签,关于html标签元素的data-*属性

关于这个主题的文章和博客其实已经非常多了，这里并非要重复造轮子，只是看到一些例子稍微有点麻烦，其实也很简单，但是对于一个刚刚入门的人，w3c的例子甚至可能看不懂，这里列出一个最简单不过的小案例以供参考

大牛自然略过，不吝指教

代码如下

Html5 custom data attribute Test

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

if(isIe()){

//如果是ie浏览器这样调用

alert(user.getAttribute('data-name'));

}

else{

//非ie浏览器调用方法

alert(user.dataset['name']);

}

//判断是否是ie，但是在ie10 或者ie11下，实际检测出来的效果是false，这里稍微注意一下即可

function isIe(){

return window.ActiveXObject ? true : false;

}

这足够简单了吧，

1.定义一个div标签，一个属性叫做data-name,  data-  是固定的，后面的随意

2.根据浏览器弹出这个属性的值

jQuery-对标签元素 文本操作-属性操作-文档的操作

一.对标签元素文本操作 1.1 对标签中内容的操作 // js var div1 = document.getElementById("div1"); div1.innerText ...

javaScript tips —— 标签上的data属性

HTML5规定可以为元素添加非标准型的属性,只需添加前缀data-,这些属性可以随意添加,随意命名,目的是为元素提供与渲染无关的信息,或提供语义信息. 传统获取方式 'getAttribute' da ...

HTML 标签元素的 align 属性

align 属性规定段落中文本的对齐方式. 有 left  right center  justify 这些参数 left  right center  就是左对齐 右对齐 中间对齐 justify  ...

input标签元素，value属性取值问题，赋值

验证val:

js 获取html5的data属性

我以前一直以为只能用jquery的data()来获取 哈哈 是我太弱了

dat ...

webAPI(DOM) 2.1 获取页面元素 | 事件1 | 属性操作 | 节点 | 创建元素 | 事件2

js分三个部分: ECMAScript标准:js的基本语法 DOM:Ducument Object Model--->文档对象模型--->操作页面的元素 BOM:Browser Objec ...

JS组件系列——使用HTML标签的data属性初始化JS组件

前言:最近使用bootstrap组件的时候发现一个易用性问题,很多简单的组件初始化都需要在JS里面写很多的初始化代码,比如一个简单的select标签,因为仅仅只是需要从后台获取数据填充到option里 ...

html5中form表单新增属性以及改良的input标签元素的种类

在HTML5中,表单新增了一些属性,input标签也有了更多的type类型,有些实现了js才能实现的特效,但目前有些浏览器不能全部支持.下面是一些h5在表单和input标签上的一些改动.

jQuery基础之获取和设置标签元素属性

jQuery基础之获取和设置标签元素属性方法,如下图: 代码实现:

随机推荐

von Neumann architecture

COMPUTER ORGANIZATION AND ARCHITECTURE DESIGNING FOR PERFORMANCE NINTH EDITION 3.1 COMPUTER COMPONEN ...

Mac OS 10.10 Yosemite正式版怎么升级 升级教程

苹果在2014年10月17号凌晨一点召开了新品发布会,推出了新的 iPad.iMac 产品,以及大家一直所期盼的 Mac OS 10.10 正式版系统.个人是从 Mac OS 10.10 的第一个测试 ...

微信小程序+OLAMI(欧拉蜜)自然语言API接口制作智能查询工具--快递、聊天、日历等

微信小程序最近比较热门,再加上自然语义理解也越来越被人关注,于是我想赶赶潮流,做一个小程序试试.想来想去快递查询应该是一种比较普遍的需求. 如果你也在通过自然语言接口做点什么,希望我的这篇博客能帮到你 ...

FOFA爬虫大法——API的简单利用

FOFA是一款网络空间搜索引擎,它通过进行网络空间测绘,帮助研究人员或者企业迅速进行网络资产匹配,例如进行漏洞影响范围分析.应用分布统计.应用流行度等. 何为API?如果你在百度百科上搜索,你会得到如 ...

linux 命令 — download

wget 下载工具 一般 wget url 下载url指定的资源,日志输出到stdout,文件名称和url中指定的资源名称一致 wget url -o log -O file -o:指定日志输出到的文 ...

set和multiset的用法

set #include #include #include #include

Date类的使用

[构造方法] 1)Date():无参构造 [代码] Date date = new Date(); System.out.println(date); 2)Date(long time):带参构造 [ ...

《2015 html5 iweb 峰会观会后感》

今天是2015  html5 iweb 峰会,大会在早上8:30,就开始了,没想到被坑了,看错一个字,把"国际会议中心",看成了"国家会议中心".大约过了10多 ...

C# .NET Web Api 保存Session

Global.asax中添加: public override void Init() { this.PostAuthenticateRequest += (sender, e) => Http ...

linq partion by 用法

var PartinoByList = list.OrderBy(x => x.DateType).GroupBy(x => new { x.ProductCatagoryId, x.Su ...