2

私は JavaScript の初心者で、今は自分でいくつかの練習をしています。プラクティスの 1 つは、テキスト ボックスから値を取得し、アラート ウィンドウまたは を使用して HTML ページに書き留めることDocument.writeln()です。しかし、その後、私はいくつかの奇妙な問題に気づきます。このJavaScriptを実行しようとすると：

<!DOCTYPE html>

<html>
    <head>
        <meta charset = "utf-8">
        <title>HTML Practice</title>
        <script type="text/javascript" >
            function testing(){

                window.alert("testing");
                document.writeln("test");
                document.writeln("test");
                document.writeln("test");
                document.writeln("test");
                window.alert(document.getElementById('test0').value);
                window.alert(document.getElementById('test2').value);
            }
        </script>
    </head>

    <body>
        <table>
            <tr>
                <td><label>TextBox</label></td>
                <td><input type="text" id="test0" value="12" /></td>
            </tr>
            <tr>
                <td><label>Another TextBox</label></td>
                <td><input type="text" id="test2" value="3" /></td>
            </tr>
            <tr>
                <td><input type="button" id="button" value="Click here!" onclick="testing()" /></td>
                <td>Click this button to read the text in textbox</td>
            </tr>
        </table>
    </body>
</html>

アラート ウィンドウは表示されますが、最後の 2 つのアラート ウィンドウは表示されません。奇妙なことに、このようにjavascriptの2つの下の行を上に移動すると

window.alert(document.getElementById('test0').value); //this code is now on top
window.alert(document.getElementById('test2').value);    
window.alert("testing");
document.writeln("test");
document.writeln("test");
document.writeln("test");
document.writeln("test");

これら 2 つの警告ウィンドウが表示されます。別の問題もあります。この問題を追跡するために、いくつかのバリエーションを試します。

document.writeln(document.getElementById('test0').value);
document.writeln(document.getElementById('test2').value);    
window.alert("testing");
document.writeln("test");
document.writeln("test");
document.writeln("test");
document.writeln("test");

test0そしてtest2私の2つのテキストボックスのIDです。test0との値がtest2それぞれ 12 と 3 の場合、警告ウィンドウは表示されず、HTML ページに次のように表示されます。

12

しかし、これらの 2 つの上部の行を次のように下部に配置すると、次のようになります。

window.alert("testing");
document.writeln("test");
document.writeln("test");
document.writeln("test");
document.writeln("test");
document.writeln(document.getElementById('test0').value);
document.writeln(document.getElementById('test2').value); //Now on the bottom

上記と同じテキストボックス値を使用すると、警告ウィンドウが表示され、これが HTML ページに表示されます。

test test test test

私が期待したのは、出力が次のようになることです。

test
test
test
test
12
3

線の位置だけを変更すると、出力が大きく異なるのはなぜですか? の使用法に何か問題がありDocument.Writeln()ますか?

4

3 に答える 3

4

ドキュメントに書き込むとすぐに

document.writeline("test");

ボックスを含め、既存の HTML をすべて削除します。それらが存在しない場合は、を返します。<input>document.getelementById("test0");null

Firebug を使用して簡単に見つけることがdocument.writeln("test")できます。コンソールに書き込むだけで、すべての要素がなくなっていることがわかります。

于 2012-10-16T10:42:47.240 に答える
0

js 関数のテストの最初の行

document.writeln(document.getElementById('test2').value);

入力フィールド test2 ie-12 の値を書き込み、他のすべての html 要素をクリアするためUncaught TypeError: Cannot read property 'value' of null、dom に存在しない要素のプロパティにアクセスしようとすると発生します。

于 2012-10-16T11:01:59.003 に答える
0

document.writeln() は時間の無駄です。プログラマーが通常意図していることを実行しないからです。
タグ をレンダリングするには write() を使用するだけです。

于 2016-01-27T17:08:17.387 に答える