初期化コード&エンティティオブジェクトの選択

10572 ワード
テキストリンク
ドキュメント初期化イベント関数init
inputとspanラベルがscriptコードより低い場合、エラーが発生します.
これは、id値を生成するにはinputとspanラベルをロードする必要があるためです.
id値が現れる前に関数が実行されるからです.
エラーを回避するには、init()という関数にイベントを配置し、windowを開きます.onloadを使用して、ウィンドウのすべてのロード後にイベントを含むinit()を呼び出す必要があります.
<body>
    <script>
    function printResult(){
        var x = prompt("x값을 입력하세요.",0);
        var y = prompt("y값을 입력하세요.",0);
        x = parseInt(x);
        y = parseInt(y);
        btnPrint.value = x+y;
        span1.innerText = x+y;
    }
    function init(){
        btnPrint.onclick = printResult;
        span1.onclick = printResult;
    }
    window.onload = init;
    </script>
    <input type="button" value="클릭" id="btnPrint"/> <br/>
    <span id = "span1">스팬입니다.</span>
</body>
Windowsは最初に実行される最上位オブジェクトなので、Windowsです.onload
つまり、Windowsがすべてロードされるとinit関数が呼び出されるので、エラーは発生しません.
オブジェクトIDネーミングメソッドの問題
HTMLやCSSではid値を指定する際にbtnPrint(アルパカ記号)を使用せず、btn-printのように使用指示の命名規則が存在する.
この場合、これらの不便な点を解決する方法として、ドキュメントを使用します.
Documentオブジェクトは、値を含む大きな風呂敷と考えられます.
<body>
    <script>
    function printResult(){
    	var btnPrint = document.getElementById("btn-print"); //btn-print라는 이름의 엘리먼트를 줘!
        var x = prompt("x값을 입력하세요.",0);
        var y = prompt("y값을 입력하세요.",0);
        x = parseInt(x);
        y = parseInt(y);
        btnPrint.value = x+y;
    }
    function init(){
    	var btnPrint = document.getElementById("btn-print"); //btn-print라는 이름의 엘리먼트를 줘!
        btnPrint.onclick = printResult;
    }
    window.onload = init;
    </script>
    <input type="button" value="클릭" id="btn-print"/> <br/>
    <span id = "span1">스팬입니다.</span>
</body>
btnPrintのドキュメント.getElementById(「btn-print」)で値を受信し、btnPrintを使用します.
ネットワーク開発総合クラス第1週(研究)
REST API