15更新），加入range技巧(2)

3）宁可多次判断，也不重复进行一次重新匹配。e.g:
input控件中第一次取到的值为：1，第二次按下的值为12
如果进行判断的话，可以事件存储一个值，也就是前一次按下的值。如上面的值1。第二次按下时没有退格，即再在前面的值中加一个字符2，那么我们将在前面1中匹配出的数据中进行匹配。这样可以大大的减轻循环的次数。
4）利用问题一中所写的limit，将数据动态取出。这些能够很好的解决HTML字符串过大的问题，但此方法控制不当的话，也会事得其反。
5） 利用range技巧来加入HTMLStr，也就是说，当一个HTML字符串太大时，再用innerHTML+=anotherHTMLStr，这样的方法，也是会让速度太慢，在IE中，我们可以用obj.insertAdjacentHTML("beforeEnd", anotherHTMLStr)这样的方法来插入HTML，这个方法经过测试，比较稳定。利用limit再加上insertAdjacentHTML，会使得插入的HTML代码速度更稳定，而在Mozilla中，则要利用range的技巧来达到此目的，如下：

if (browser.isMozilla) {
 HTMLElement.prototype.insertAdjacentHTML = function (sWhere, sHTML) {
 var df; var r = this.ownerDocument.createRange();
 switch (String(sWhere).toLowerCase()) {
 case "beforebegin":
 r.setStartBefore(this);
 df = r.createContextualFragment(sHTML);
 this.parentNode.insertBefore(df, this);
 break;
 case "afterbegin":
 r.selectNodeContents(this);
 r.collapse(true);
 df = r.createContextualFragment(sHTML);
 this.insertBefore(df, this.firstChild);
 break;
 case "beforeend":
 r.selectNodeContents(this);
 r.collapse(false);
 df = r.createContextualFragment(sHTML);
 this.appendChild(df);
 break;
 case "afterend":
 r.setStartAfter(this);
 df = r.createContextualFragment(sHTML);
 this.parentNode.insertBefore(df, this.nextSibling);
 break;
 }
 };
}

后记：效率问题没有一个完整的解决方法，只有实践中根据需要而定。因此，上面的方法仅供您参考，如果你也有一些好的方法，可以在评论中写下您的经验，以便交流。

您可能感兴趣的文章: