概述
2019独角兽企业重金招聘Python工程师标准>>>
今天在测试IE与chrome的兼容性问题的时候,发现了一个奇怪的现象。
使用到了data()属性, 我在html标签中使用了 data-myName
在chrome中使用
var ddd = $(this).data()
var xxx = ddd.myname;
这样是可以获取到的。
但是换成了IE 之后。。。。
TMD 就直接不鸟我了。。。。直接就获取不到这个变量了。。。 shit 啊
后来在我的导师葛亮的指导下,他说html5 data()属性的一些东西。然后我又去查了下jquery的api 得知到。。。
// Gets all values
if (key === undefined) {
if (this.length) {
data = jQuery.data(elem);
if (elem.nodeType === 1 && !jQuery._data(elem, "parsedAttrs")) {
attr = elem.attributes;
for (l = attr.length; i < l; i++) {
name = attr[i].name;
if (name.indexOf("data-") === 0) {
name = jQuery.camelCase(name.substring(5));
dataAttr(elem, name, data[name]);
}
}
jQuery._data(elem, "parsedAttrs", true);
}
}
return data;
}
然后进入到 dataAttr函数中去了解了下
function dataAttr(elem, key, data) {
// If nothing was found internally, try to fetch any
// data from the HTML5 data-* attribute
if (data === undefined && elem.nodeType === 1) {
var name = "data-" + key.replace(rmultiDash, "-$1").toLowerCase();
data = elem.getAttribute(name);
if (typeof data === "string") {
try {
data = data === "true" ? true : data === "false" ? false : data === "null" ? null : jQuery.isNumeric(data) ? +data : rbrace.test(data) ? jQuery.parseJSON(data) : data;
} catch(e) {}
// Make sure we set the data so it isn't changed later
jQuery.data(elem, key, data);
} else {
data = undefined;
}
}
return data;
}
jquery 建议我们所写的data是遵守html5 的data-* 属性的。。。。。。。
shit!!!!
然后我又无耻的查看了下 html5 的 data-* 的属性
然后查到了,
All attribute names on HTML elements in HTML documents get ASCII-lowercased automatically, so the restriction on ASCII uppercase letters doesn't affect such documents.
看到了ASCII-lowercased了之后我顿时想死了。。。。。 尼玛只能小写啊!!!!
所以严格点的规范是写成:
在html中data-my-name
然后在js中获取是:
var ddd = $(this).data()
var xxx = ddd.myName;(js会自动转换成驼峰形式来获取的)
所有说:::::规范啊!规范啊!!!!
转载于:https://my.oschina.net/bosscheng/blog/132826
最后
以上就是犹豫盼望为你收集整理的记一次HTML5的data()标准-大小写规范的重要性的全部内容,希望文章能够帮你解决记一次HTML5的data()标准-大小写规范的重要性所遇到的程序开发问题。
如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。
发表评论 取消回复