Uncaught TypeError: Cannot read property 'style' of null怎么處理這個問題?
<!DOCTYPE html>
<html>
<head>
? ? <title></title>
? ? <style>
? ? ? ? #my3dspace{
? ? ? ? ? ? -webkit-perspective: 800;
? ? ? ? ? ? -webkit-perspective-origin: 50% 50%;
? ? ? ? ? ? overflow:hidden;
? ? ? ? }
? ? ? ? #pagegroup{
? ? ? ? ? ? width:400px;
? ? ? ? ? ? height:400px;
? ? ? ? ? ? margin:0 auto;
? ? ? ? ? ? -webkit-transform-style:preserve-3d;
? ? ? ? ? ? position: relative;
? ? ? ? }
? ? ? ? .page{
? ? ? ? ? ? width:360px;
? ? ? ? ? ? height:360px;
? ? ? ? ? ? padding:20px;
? ? ? ? ? ? background-color: black;
? ? ? ? ? ? color:white;
? ? ? ? ? ? font-weight:bold;
? ? ? ? ? ? font-size:360px;
? ? ? ? ? ? line-height:360px;
? ? ? ? ? ? text-align:center;
? ? ? ? ? ? position:absolute;
? ? ? ? }
? ? ? ? #page1{
? ? ? ? ? ? -webkit-transform-origin:bottom;
? ? ? ? ? ? -webkit-transition: -webkit-transform 1s linear;
? ? ? ? }
? ? ? ? #page2,#page3,#page4,#page5,#page6{
? ? ? ? ? ? -webkit-transform-origin:bottom;
? ? ? ? ? ? -webkit-transition: -webkit-transform 1s linear;
? ? ? ? ? ? -webkit-transform: rotateX(90deg);
? ? ? ? }
? ? ? ? #op{
? ? ? ? ? ? text-align:center;
? ? ? ? ? ? margin: 40px auto;
? ? ? ? }
? ? </style>
? ? <script type="text/javascript">
? ? ? ? var curIndex = 1;
? ? ? ? function next(){
? ? ? ? ? ? if( curIndex == 6 )
? ? ? ? ? ? ? ? return;
? ? ? ? ? ? var curPage = document.getElementById("page"+curIndex);
? ? ? ? ? ? curPage.style.webkitTransform = "rotateX(-90deg)";
? ? ? ? ? ? curIndex ++;
? ? ? ? ? ? var nextPage = document.getElementById("page"+curIndex);
? ? ? ? ? ? nextPage.style.webkitTransform = "rotateX(0deg)";
? ? ? ? }
? ? ? ? function prev(){
? ? ? ? ? ? if( curIndex == 1 )
? ? ? ? ? ? ? ? return;
? ? ? ? ? ? var curPage = document.getElementById("page"+curIndex);
? ? ? ? ? ? curPage.style.webkitTransform = "rotateX(90deg)";
? ? ? ? ? ? curIndex --;
? ? ? ? ? ? var prevPage = document.getElementById("page"+curIndex);
? ? ? ? ? ? prevPage.style.webkitTransform = "rotateX(0deg)";
? ? ? ? }
? ? </script>
</head>
<body>
? ? <div id="my3dspace">
? ? ? ? <div id="pagegroup">
? ? ? ? ? ? <div class="page" id="page1">1</div>
? ? ? ? ? ? <div class="page" id="page2">2</div>
? ? ? ? ? ? <div class="page" id="page3">3</div>
? ? ? ? ? ? <div class="page" id="page4">4</div>
? ? ? ? ? ? <div class="page" id="page5">5</div>
? ? ? ? ? ? <div class="page" id="page6">6</div>
? ? ? ? </div>
? ? </div>
? ? <div id="op">
? ? ? ? <a href="javascript:next()">next</a> <a href="javascript:prev()">previous</a>
? ? </div>
</body>
</html>
2016-11-12
同上,復(fù)制粘貼樓主的代碼,運(yùn)行之后并未發(fā)現(xiàn)錯誤。
2016-11-10
運(yùn)行了你的代碼,沒有報錯?。课伊?xí)慣將js代碼放到body下面,可以保證dom全部加載完在執(zhí)行js代碼