Beberapa masa dahulu, halaman web pengakuan itu sangat menarik, jadi saya cuba menonton video dan menulis kod, tetapi mengapa skrip untuk menukar latar belakang secara automatik tidak dilaksanakan? Tolong beri saya nasihat## Hanya satu daripada dua skrip telah dilaksanakan ##
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>你是我的最爱--000</title>
<style type="text/css">
*{margin:0;padding:0;}
#bg_body{
background:url(image/1.jpg) no-repeat center #eee;
background-size:cover;
/* background-attachment:fixed;
height:1000px; */
}
/*start top*/
.top{width:400px;height:100px;margin:60px auto;font-size:30px;font-family:"华文行楷";color:#fff;}
/*end top*/
/*start box*/
.box{width:310px;height:310px;margin:auto;perspective:800px;}
.box .pic{position:relative;transform-style:preserve-3d;animation:play 10s linear infinite;}/*匀速 无线运行*/
.box ul li{list-style:none;position:absolute;top:0;left:0;}
/*end box*/
#text{width:980px;height:130px;color:#0099ff;margin:auto;font-size:30px;font-family:"华文行楷";}
/*定义一个关键帧*/
@keyframes play{
from{transform:rotateY(0deg);}
to{transform:rotateY(360deg);}
}
</style>
<script type="text/javascript">
window.onload=function typing (){
var oBody=document.getElementById('bg_body');
var oS=oBody.style;
function BgChenge(){
oS.backgroundImage='url(image/'+(parseInt(Math.random() * 6) + 1)+'.jpg)';
};
function BgPosition(){
oS.backgroundRepeat='no-repeat';
oS.backgroundPosition='center';
oS.backgroundAttachment='fixed';
};
function LoadMethod(){
BgChenge();
BgPosition()
};
setInterval(LoadMethod,1000);
};
</script>
</head>
<body id="bg_body">
<!--start top-->
<p class="top">
<marquee behavior=alternate>时光不老 我们不散</marquee>
</p>
<!--end top-->
<!--start box-->
<p class="box">
<p class="pic">
<ul>
<li><img src="image/1.png"height=""width=""alt=""/></li>
<li><img src="image/2.png"height=""width=""alt=""/></li>
<li><img src="image/3.png"height=""width=""alt=""/></li>
<li><img src="image/4.png"height=""width=""alt=""/></li>
<li><img src="image/5.png"height=""width=""alt=""/></li>
<li><img src="image/6.png"height=""width=""alt=""/></li>
</ul>
</p>
</p>
<!--end box-->
<!--star text-->
<p id="text"></p>
<!--end text-->
<embed src="music/告白气球 - 周杰伦.mp3" Volume="30" width="0" height="0"></embed>
<script src="js/jquery.min.js"></script>
<script src="js/jquery.min.js"></script>
<script src="js/jquery.snow.min.js"></script>
<script>
//拿到每一个li
$(".pic ul li").each(function(i){
var deg = 360/$(".pic ul li").size();
//当前li对象
$(this).css({"transform":"rotateY("+deg*i+"deg)translateZ(216px)"});
$.fn.snow({
minSize:10,maxSize:15,newOn:500,flakeColo:"#ffffff"
});
});
var i = 0;
var str ="能够遇见你是我最大的幸运，有了你生活变得丰富多彩，有了你，世界变得如此迷人，你是我的世界，我的世界是你，对我来说，不是在最美好的时光遇见了你，而是遇见你以后都是最美好的时光！"
window.onload = function typing(){
//js 获取p
var myp = document.getElementById("text");
myp.innerHTML += str.charAt(i);
i++;
var id = setTimeout(typing,100);
if(i==str.length){
clearTimeout(id);
}
}
</script>
</body>
</html>
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Gunakan
window.addEventListener('load',function(){})替换window.onload = function(){}关键字：
DOM0级事件与DOM2级事件Acara window.onload adalah unik dalam js Tidak kira berapa banyak yang anda tulis, hanya satu yang akan dilaksanakan dan ia adalah yang terakhir, jadi anda boleh mempertimbangkan untuk menggunakan $(function(){}) dalam jq, ia tidak akan. muncul disebabkan oleh Pesanan menukar pemaparan penyemak imbas, dan penyemak imbas akan memaparkan mengikut jumlah $(function(){}).
Acara window.onload hanya boleh dilaksanakan sekali Jika anda telah merujuk jquery.min.js, anda boleh cuba menukarnya kepada $(function(){}), yang boleh dirujuk beberapa kali.