innerHTML操作の最適化（コード実行効率の向上）_JavaScriptスキル

<script> <span>document.onmousedown = function() { <a style="CURSOR: pointer" data="18068" class="copybut" id="copybut18068" onclick="doCopy('code18068')">var html = ""; <u>for (var i = 0; i html = "< p>" Math.random() "<p>" </u></a>} </span>document.getElementsByTagName('div')[0].innerHTML = html; </div></script&gt ; <div class="codebody" id="code18068"><BR> <BR>注: innerHTML には標準 DOM に appendChild がないため、非効率な "= メソッドが使用されます。 <BR>innerHTML と標準 DOM を組み合わせて使用​​できるため、両方の利点を活用できます。コードの一部は次のとおりです。<BR><BR><BR><BR><BR>コードをコピーします<BR><BR></div> コードは次のとおりです: <BR><BR> <BR><script> <div class="codetitle">document.onmousedown = function() { <span>var html = "" <a style="CURSOR: pointer" data="96042" class="copybut" id="copybut96042" onclick="doCopy('code96042')">; (var i = 0; i html = "<p>" Math.random() "<p>"; </U>var temp = document.createElement ("div"); </a> temp.innerHTML = html; </span>while (temp.firstChild) { </div>document.getElementsByTagName('div')[0].appendChild(temp.firstChild); } <div class="codebody" id="code96042">}; <BR> </script>


注: 要素を作成し、innerHTML を挿入して、その要素に対して標準の DOM 操作を使用します。
まだ終わっていません。非同期 innerHTML はより強力なソリューションを提供します。コードの一部は次のとおりです:




コードをコピー


コードは次のとおりです。