2

関数を使用してコンテンツを生成するコードを実行しようとしていますが、コンテンツを onclick で変更できるようにしていますが、コンテンツが変更されても CSS は適用されません。それは本当に奇妙です。

一般化された私のコードの例を次に示します。

function flush(divId) {
    $(divId).parentNode.removeChild(divId);
}

function makeContent(arg1,arg2,arg3) {
    document.write('<div class="exampleClass" id="' + arg1 + 'Id">');
    if(arg3 < 1000) { // Chose an arbitrary number
        if (arg2 != "ArbritraryArg") {
            document.write('<span class="spanLink" onclick="flush(\'' + arg1 + 'Id\')\; makeContent(\'' + arg1 + '\',\'Something\',' + arg3 + ')\;">Blarg</span>');
        } else {
            document.write('<span class="spanLink" onclick="flush(\'' + arg1 + 'Id\')\; makeContent(\'' + arg1 + '\',\'SomethingElse\',' + arg3 + ')\;">Yearg</span>');
        }
    }

    var i = 0;
    var mdArray = eval(arg1 + 'Id' + arg3); // This is a multidimensional array which does exist just above the lines for function flush(). There are no possible problems in the array's definition, and so I did not include it here.
    do {
        document.write('<div class="exampleClass2">' + mdArray[i][0] + '</div><div class="exampleClass3">' + mdArray[i][1] + '</div>');
        i++;
    } while (i < mdArray.length);

    document.write('</div>');
    var parentDiv = document.getElementById('parentDiv');
    parentDiv.insertBefore(monster + 'Set',parentDiv.firstChild);
}

document.write('<div id="parentDiv">');
makeContent('Arg1','Something',Arg3);
document.write('</div>');

私の問題は、このスクリプト ファイルを .html ドキュメントで参照してテストすると、初めて makeContent() が実行されたとき (スクリプト自体によって実行されたとき)、すべてが完璧であるということです。フラッシュ関数を呼び出すだけの外部<span>リンクを使用してフラッシュ()関数をテストしましたが、正常に動作し、makeContent()データを削除して、HTMLドキュメントに他のすべてを残します。

したがって、<span>私が書いたサンプル コードの 9 行目で生成されたリンクをクリックすると、コンテンツは変更されますが、関連する CSS はどれも再適用されず、HTML ドキュメント内の他のすべてのコンテンツも消えます。どうしたの？これと同じ問題は、flush() をテストした方法と同じ方法で外部リンクを使用して同じ関数を試すと発生します。

誰かが疑問に思っている場合に備えて、HTML ページを取得する方法を次に示します。

<html><head><title>Testing</title>
<link rel="stylesheet" href="stylesheet.css">
</head><body>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit,...</p>
<script href="script.js"></script>
<p><span class="spanLink" onclick="flush('Arg1Id');">Get rid of the content (TEST)</span></p>
<p><span class="spanLink" onclick="flush('Arg1Id'); makeContent('Arg1','Arg2',Arg3);">Try regenerating the content (TEST)</span></p>
</body></html>

助けてくれてありがとう！

編集: test.html ファイルで、コンテンツを再生成しようとすると、タイトルが「Testing」から「test.html」に変わることに気付きました...新しく生成されたコンテンツは、ファイル内のすべての HTML 要素を強制終了しますか? ?

4

1 に答える 1