私はサイトを持っていて、ページが読み込まれるたびに別の HTML5 Javascript アニメーションをランダムに読み込みたいと思っています.JavaScript は私のスキルの中で最も弱いものの 1 つです. '検索してみました) 質問をクローズするために投票してください。
基本的に私が使用した方法は汚いものであり、おそらくそれが機能しない理由です.基本的に私はrandommathを試しましたが、運がなかったので、これを私のJSスキルが非常に弱いことが原因でした.簡単に見えた別の方法も機能しません.これは基本的に、ページの読み込み時に HTML を挿入することです。たとえば、a.html と b.html には異なるスクリプトが含まれています。
これは私のコードがどのように見えるかです:
HTML
<html>
<head>
<script src="js/insert.js"></script><!-- This inserts the Random Page -->
</head>
<body onload="loadExternalHTMLPage()">
<div id="injectjs"> </div>
<canvas="id"> </canvas>
<script src="js/animation-lib-pageA.js"></script><!--Library for pageA -->
<script src="js/animation-lib-pageB.js"></script><!--Library for pageB -->
</body>
</html>
Inject.js
function loadExternalHTMLPage() {
var xmlhttp;
var pagesToDisplay = ['a.html', 'b.html'];
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
} else {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("jsinsert").innerHTML = xmlhttp.responseText;
}
}
var randomnumber = Math.floor(Math.random() * pagesToDisplay.length);
xmlhttp.open("GET", pagesToDisplay[randomnumber], true);
xmlhttp.send();
}
ほとんどの JS Guru は、ページの読み込み時に a.html と b.html をランダムに挿入していることを確認できるはずですが、これは機能しますが、問題は a.html と b.html に含まれるスクリプトが実行されていないことです。(firebug を使用すると、スクリプトが意図したとおりに挿入されていることがはっきりとわかります)。
たとえば、 a と b は次のようになります。
a.html
<script> window.onload = function () { }</script>
b.html
<script> window.onload = function () { } </script>
基本的に、A と B 内のコードは有効であり、この挿入内で正常に動作します。上記の例は単なるプレースホルダーとして記入しました。A と B には両方とも、キャンバス内に含まれるアニメーションを実行する JavaScript が含まれていますが、現在は機能せず、ページが読み込まれた後にスクリプトを読み込んでいるという事実と関係があると思われます。前もって感謝します。