为何报错
来源:3-2 通用适配实现
weibo_我是LUFFCIER_0
2020-12-27 12:35:20
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=0.5, maximum-scale=0.5, minimum-scale=0.5, user-scalable=no" >
<title>Document</title>
<style type="text/css">
*{
box-sizing: border-box;
padding: 0;
margin: 0;
}
.header-container,
.footer-container{
position: fixed;
z-index: 999;
border-bottom: 0.025rem solid black;
}
.header-container{
width: 100%;
background-color: rgba(222,24,27,0.8);
height: 2.5rem;
top: 0;
}
.main-container{
padding: 2.5rem 0;
}
.slider-container{
height: 9.15rem;
background-color: green;
}
.nav-container{
height: 8.475rem;
background-color:blue;
}
.recommend-container{
height: 50rem;
background-color: pink;
}
.footer-container{
width: 100%;
background-color: green;
height: 2.5rem;
bottom: 0;
}
</style>
<script type="text/javascript">
(function(){
var docEl=document.documentElement,
viewportEl=document.querySelector('meta[name="viewport"]'),
dpr=window.devicePixelRatio||1;
dpr=dpr>=3?3:(dpr>=2?2:1);
docEl.setAtrribute('data-dpr',dpr);
var scale=1/dpr,
content="width=device-width, initial-scale="+scale+", maximum-scale="+scale+", minimum-scale="+scale+", user-scalable=no";
if(viewportEl){
viewportEl.setAtrribute('content',content);
}
else{
viewportEl=document.createElement('meta');
viewportEl.setAtrribute('name','viewport');
viewportEl.setAtrribute('content',content);
document.head.appendChild(viewportEl);
}
setRem();
window.addEventListener("resize",setRem);
function setRem(){
var ratio=18.75;
var viewWidth=document.documentElement.getBoundingClientRect().width || window.innerWidth;
document.documentElement.style.fontSize=viewWidth/ratio+'px';
}
})();
</script>
</head>
<body>
<div class="header-container"></div>
<div class="main-container">
<div class="slider-container"> </div>
<nav class="nav-container"> </nav>
<div class="recommend-container"> </div>
</div>
<div class="footer-container"></div>
</body>
</html>
1回答
好帮手慕星星
2020-12-27
同学你好,测试代码报错信息是setAttribute方法写错了,不是一个方法
找到报错信息位置并修改就好了,如下
祝学习愉快!
相似问题
回答 1