javascript处理页面元素时捣乱的小空格

   在编辑前台tag的时候,我们可能会遇到通过js来根据条件来重新对界面的tag进行一些调整的情况,例如下面的情况:

    <div id="testDiv">

       &nbsp;&nbsp;

       <input name="innerInput" type="button"value="按钮一" />&nbsp;&nbsp;

       <input name="innerInput" type="button"value="按钮二" />&nbsp;&nbsp;

       <input name="innerInput" type="button"value="按钮三" />

</div>

如果使用下面脚本进行处理的话:

    function ReplaceButtons(){

        var arr =document.all("innerInput");

        var obj =document.all("testDiv");

        var sNewHTML = "";

        for (var i=0; i< arr.length; i++){

            sNewHTML += "&nbsp;&nbsp;" + arr[i].outerHTML;

        }

        if (sNewHTML != ""){

            obj.innerHTML = sNewHTML;

        }

    }

    需要注意的是红色字体部分,这里如果执行脚本的话,我们会发现这三个按钮之间的间距变小了!而且恰恰少了一个空格&nbsp;这就意味着，我们在编写前台tag的时候，空格也是被当做一个空格的，做个记录。