訪問DOM元素是有代價的，修改DOM元素則更為昂貴，因為它會導致瀏覽器重新計算頁面的幾何變化。
當然，最壞的情況是在循環中訪問修改元素，尤其是對HTML元素集合循環操作。
例如：
複製代碼代碼如下:
<!-- 優化前-->
<script type="text/javascript">
function innerHTMLLoop () {
for(var count = 0; count < 15000; count++){
document.getElementById('here').innerHTML+='a';
}
}
</script>
這個函數循環修改頁面元素的內容。這段代碼的問題在於，每次循環迭代，該元素都被訪問兩次：一次讀取innerHTML屬性，另外一次重寫它。
一個效率更高的做法是使用局部變量存儲更新後的內容，然後在循環結束後一次性寫入：
複製代碼代碼如下:
<!-- 優化後-->
<script type="text/javascript">
function innerHTMLLoop () {
var content = '';
for(var count = 0; count < 15000; count++){
content+='a';
}
document.getElementById('here').innerHTML+=content;
}
</script>
訪問DOM的次數越多，代碼運行速度越慢。因此，在有其他方案可以代替的時候，我們要盡量減少訪問DOM的次數。