2

div に出力する関数を呼び出してから、div にも出力される文字列を返します。以下は「2」のみを出力しますが、「1」、「2」の順に出力することを期待していました。

<body>
     <div id="view"></div>
</body>
<script>
global_cdiv = "view"
function test1(){
    document.getElementById(global_cdiv).innerHTML += "one" + "<br>";
    return "two";
}
document.getElementById(global_cdiv).innerHTML += test1();

</script>

デバッグにはエラーも何も表示されません。Javascript が関数内の innerHTML を無視するのはなぜですか? (回避策は、test1() の値を変数に格納してから出力することですが、なぜ test1 を直接使用できないのでしょうか?)

4

3 に答える 3

4 
document.getElementById(global_cdiv).innerHTML += test1();

の短縮形です

document.getElementById(global_cdiv).innerHTML = document.getElementById(global_cdiv).innerHTML + test1();

test1()値を評価する前に、innerHTML空である値が評価され、その結果が と連結されtest1()ますtwo。というわけで、実際の表現はこうなります

document.getElementById(global_cdiv).innerHTML = "" + "two";

これにより、内部の設定が上書きされtest1()ます。そのため、 のみが表示されtwoます。

本当に上書きされることを理解するには、次のtest1()ように変更します

function test1(){
    document.getElementById(global_cdiv).innerHTML += "one" + "<br>";
    console.log(document.getElementById(global_cdiv).innerHTML);
    return "two";
}

印刷しますone<br>

于 2013-10-26T09:09:36.963 に答える
1

これを呼び出すときdocument.getElementById(global_cdiv).innerHTML += test1()の実行順序は次のとおりです
。1-評価document.getElementById(global_cdiv).innerHTMLして一時変数に保存します2-関数
を実行します3-関数 の戻り値に一時変数を追加します 4-結果をに割り当てますtest1
test1
document.getElementById(global_cdiv).innerHTML

これは大まかにあなたがしていることです：

var temp = document.getElementById(global_cdiv).innerHTML
document.getElementById(global_cdiv).innerHTML = "one"  // inside your function
document.getElementById(global_cdiv).innerHTML = temp + "two"

2番目innerHTML（あなたの場合は関数内にあります）の割り当ては、3番目の割り当てによって上書きされます（「2」に追加されません）

于 2013-10-26T09:14:44.013 に答える
0 
<body>
     <div id="view"></div>
</body>
<script>
global_cdiv = "view";
    var temp = ""; 
function test1(){
   temp = "one" + "<br>";
    return temp + "two";
}
document.getElementById(global_cdiv).innerHTML = test1();

</script>

上記のコードをチェックアウトします。これで問題は解決します。

于 2013-10-26T09:36:06.987 に答える