0

これが状況です。次のような多くのスクリプトを使用するサイトを構築しています。

function getRandomArrayIndex(source_array) {

return Math.floor(Math.random() * source_array.length);

}

function getRandomArrayEntry(source_array) {

var random_index = getRandomArrayIndex(source_array);

return source_array[random_index];

}

function getRandomBlah() {

var blahs = [
["A"],
["B"],
["C"],
["D"],
["E"],
["F"],
["G"],
["H"],
["I"],
["L"],
["M"],
["N"],
["O"],
["P"],
["R"],
["S"],
["T"],
["V"],
["W"],
["Y"],
]; var random_blah = getRandomArrayEntry(blahs);

return random_blah;

}

function displayBlah(blah) {

const TEXT_ROW = 0;

const LINK_ROW = 1;

var blah_text = blah[TEXT_ROW];

var blah_link = blah[LINK_ROW]; if (blah_link != null) {

document.getElementById("blah").innerHTML = '<a href="' + blah_link + '">' + blah_text + '</a>';

} else {

document.getElementById("blah").innerHTML = blah_text;

}

}

function generateRandomBlah(){

var random_blah = getRandomBlah();

displayBlah(random_blah);

}

そして、これを で呼び出すと<body onload="generateRandomBlah()">、文字の 1 つがランダムに に挿入され<span id="blah"></span>ます。

したがって、これらのスクリプトは約 15 あり、それぞれ独自の関数が異なる用途のためにわずかに異なる名前を付けられています (generateRandomBlah2 など)。各スクリプトがその作業を行う HTML 内の対応する場所が異なります。

私はコーダーがあまり得意ではないので、「body onload」タグには、この 1 つのタグ内に約 15 の異なる「generateRandomBlah()」関数が含まれています。このサイトの性質上、1 つのページで一度に必要なスクリプトは 2 つまたは 3 つだけですが、任意のページでそれらのいずれかを呼び出す機能が必要です。ご覧のとおり、私の現在の戦術は、それらをすべて一度に呼び出すことです。対応するスクリプトが存在しない場合は、その事実を無視して次のスクリプトに移動します。

対応する がないという事実を無視しないことを除いて<span>。

1 つが存在しなくなるとすぐに、残りのスクリプトが壊れて、本来の目的を実際に実行しなくなります。Chrome の 'inspect code' のコードを見ると、最初のスクリプトでエラーが発生し、「Uncaught TypeError: Cannot set property 'innerHTML' of null」というエラーが表示されます。考えられる解決策がいくつかありますが、完全にオフになっている可能性があります。

1）各スクリプトにコードを追加し<span id>ます。ページにコードを挿入するページがない場合は、正常に終了して次のページに移動します-徐々に（明らかに速度的には1秒未満で）スクリプトを通過します実際に存在する場合にのみ実行します。(ご覧のとおり、問題は、コードを挿入する場所がなく、それが発生した場合に正常に終了しないという事実にスクリプトが「引っかかる」ことです。

2) 'onload' を取り除き、各スクリプトを自己完結型にして、独自の関数を呼び出します。ただし、これで問題が解決するかどうかはわかりません。

とにかく、私は困惑しているので、いくつかの助けをいただければ幸いです。

4

2 に答える 2

0

ここに何かが欠けているかどうかはわかりませんが、エラーメッセージでさえ値がnullであると不平を言っているので、明らかな解決策はnullをチェックすることです:

var element = document.getElementById("blah");

if( element !== null ) {
    element.innerHTML = '<a href="' + blah_link + '">' + blah_text + '</a>';
}

それを頻繁に行う必要がある場合は、そのための関数を作成できます。

function updateIfExists( id, content ) {
    var element = document.getElementById( id );

    if( element !== null ) {
        element.innerHTML = content;
    }
}

updateIfExists( 'blah', '<a href="' + blah_link + '">' + blah_text + '</a>' );
于 2012-07-24T09:30:41.410 に答える
0

あなたが最初の解決策で言ったように、null何かを「実行」しようとする前にテストすることは、おそらく完全に再コーディングする前の最善の策です。

function getRandomArrayIndex(source_array) {
  if(source_array === null) return; // similar lines in each function should fix everything
  return Math.floor(Math.random() * source_array.length);
}

とはいえ、非常によく似た関数の束を作成してそれらすべてを実行するという現在のソリューションよりもはるかに優れたアプローチは、何をすべきかを示すパラメーターを受け取ることができる単一の関数を作成することです。それらが本当によく似ている場合は、難しいことではなく、コードの行数が大幅に少なくなります。ページが毎回すべての関数を呼び出さないようにする方法を見つけることができれば、それもいいでしょう。ただし、nullポインターを修正することははるかに小さな問題です。

于 2012-07-24T09:31:05.117 に答える