1000字范文,内容丰富有趣,学习的好帮手!
1000字范文 > JavaScript/Js脚本处理html元素的自定义属性解析(亲测兼容Firefox与IE)【javascript】

JavaScript/Js脚本处理html元素的自定义属性解析(亲测兼容Firefox与IE)【javascript】

时间:2022-02-08 09:07:03

相关推荐

JavaScript/Js脚本处理html元素的自定义属性解析(亲测兼容Firefox与IE)【javascript】

web前端|js教程

JavaScript,自定义

web前端-js教程

HTML元素,属性已经十分丰富了。但是,在某些场合下,也会显得捉襟见肘,这时候自定义属性就发挥了十分关键的作用。

Html元素的自定义属性,使用起来,十分方便,例如:

假设我们现在需要限制,这个按钮,只能点击2次,然后就失效了。

通常的实现方式,是可以利用全局变量的形式来记录点击次数,但我们这里用自定义属性来实现这个功能,展示一下自定义属性的优势;我们对上面的button做一下改造:

可以看到,我为这个button 增加了一个自定义属性 clickCount, 并将初始值设为 0;下面我们来写实现功能的js代码:

1. 给 button 增加click事件的处理

2. 我们来写 customAttributeDemo(obj) 这个函数

对于IE来讲,使用自定义属性非常简单,因为IE自动将自定义属性解析到了DOM中,和标准属性没有任何区别,IE下的版本:

交友会员网站源码,ubuntu 系统库函数,项目如何部署到tomcat上,安卓 爬虫 案例,教师评价系统php状态图,酒泉seo代理lzw

function customAttributeDemo(obj)

{

if (obj.clickCount === )

{

obj.clickCount = 1;

}

else

{

obj.disabled = true;

}

}

上面的代码在 FireFox 下将失效,因为FireFox对自定义属性的使用,限制更高,只能使用 attributes[] 集合来访问,FireFox 下的代码:

外汇全套源码,ubuntu安装vim慢,项目部署入tomcat,api接口爬虫,php网站设计需求分析,班长seolzw

function customAttributeDemo(obj)

{

if (obj.attributes[clickCount].nodeValue === )

{

obj.attributes[clickCount].nodeValue = 1;

}

else

{

obj.disabled = true;

}

}

上面的代码,也适用于IE,所以,这个代码,就是具有兼容性的代码了。

感谢网友的交流,他给出了 getAttribute 和 setAttribute 的方法:

apizza 源码,vscode调试服务器下的代码,ubuntu杀掉xmrig,tomcat需要绑定域名吗,视频爬虫技术,php静态代码分析工具,温州seo关键词优化学习lzw

function customAttributeDemo(obj)

{

if (obj.getAttribute(clickCount) === )

obj.setAttribute(clickCount, 1);

else

obj.disabled = true;

}

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。