其他分享
首页 > 其他分享> > JS特性检测,检测元素上是否有指定属性或当前浏览器是否支持某元素或某属性

JS特性检测,检测元素上是否有指定属性或当前浏览器是否支持某元素或某属性

作者:互联网

我们在开发的过程中如果要向后兼容的话我认为这篇文章还是很能帮助到你的。可以把笔者的代码copy过去使用。

我们要检查指定元素上面是否有特定的属性,可以使用下面这个函数:

function elementSupportsAttribute(elementName, attribute) {
	if (!document.createElement) return false;
	let temp = document.createElement(elementName);
	return ( attribute in temp );
}

如果此函数返回false说明elementName中不包含attribute属性。

参数:
elementName: 字符串类型,如:‘div’
attribute: 字符串类型, 如:‘width’

或者你不提成一个方法,每次自己手动写:

"autoplay" in document.createElement('video')  //查看video元素当中是否有autoplay这个属性,答案是肯定的
"autoplay" in document.createElement('div')  //查看div元素当中是否有autoplay这个属性,答案是否定的
"flex" in document.createElement('div').style //检测div的样式中是否存在flex

在这里插入图片描述
通过此方法也可检测是在移动端还是PC端:

//定义一个变量,存放是否存在"ontouchend"事件
const hasTouch = "ontouchend" in document ? true : false;//如果存在说明是移动端结果为true,如果不存在说明是在PC端结果为false;
if(hasTouch){
	//移动端代码逻辑
}else{
	//PC端代码逻辑
}

在这里插入图片描述

标签:elementName,false,检测,元素,attribute,createElement,div,document,属性
来源: https://blog.51cto.com/u_15275953/2924468