JS 检查是否支持HTML5

最新推荐文章于 2021-06-18 00:49:12 发布

追逐吾之所求

最新推荐文章于 2021-06-18 00:49:12 发布

阅读量494

点赞数

分类专栏： JavaScript 文章标签： JS HTML5

本文链接：https://blog.youkuaiyun.com/jiongxian1/article/details/90059864

版权

JavaScript 专栏收录该内容

27 篇文章

订阅专栏

<!DOCTYPE html>
<html lang="zh-CN">
	<head>
		<meta charset="utf-8" />
		<meta name="renderer" content="webkit" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
	</head>
	<body>
		<canvas id="CanvasCheck" style="display:none;">canvas</canvas>
		<script type="text/javascript">
			window.onload = function(){
				if(!document.getElementById("CanvasCheck").getContext){
					var style = {
						backgroundColor: "#cd7fc6",
						height: "150px",
						width: "100%",
						position: "fixed",
						bottom: 0,
						left: 0,
						zIndex: 9999
					};
					var textStyle = {
						marginLeft: "auto",
						marginRight: "auto",
						width: "600px",
						fontSize: "16px",
						color: "#FFF",
						lineHeight: "30px",
						paddingTop: "40px"
					};
					var tipdiv = document.createElement("div");
					var textdiv = document.createElement("div");
					for(var i in style){
						tipdiv.style[i] = style[i];
					}
					for(var i in textStyle){
						textdiv.style[i] = textStyle[i];
					}
					var text = "您的浏览器不支持HTML5，会导致UI紊乱和部分功能无法使用。<br>"
						+"为了更好的用户体验，建议您升级您的浏览器或者更换支持HTML5的浏览器";
					textdiv.innerHTML = text;
					tipdiv.appendChild(textdiv);
					document.body.appendChild(tipdiv);
				}
			}
		</script>
    </body>
</html>