首頁 >web前端 >js教程 >ie 7/8不支援trim的屬性的解決方案_javascript技巧

ie 7/8不支援trim的屬性的解決方案_javascript技巧

WBOY
WBOY原創
2016-05-16 16:47:051093瀏覽

在ie 7 8瀏覽器中,如果使用trim()屬性去除空格的話,則會導致報錯。

因此解決這個問題有以下方案:

var aa = $("#id").val().trim()   --- 在IE中無法解析trim() 方法

解決方法:

[   var aa = $.trim($("#id").val());  ] 這個不好用,還是用下面介紹的吧,第一個已經過測試。
 

W3C那群人的腦袋被驢踢了,直到java script1.8.1才支持trim函數(與trimLeft,trimRight),可惜現在只有 firefox3.5支持。由於去除字串兩邊的空白實在太常用,各大類庫都有它的影子。加之,外國人都很有研究精力,搞鼓了相當多實現。

實現1  OK  的。 (在js中寫上這個,然後直接在你要去空格的字串後面跟上 .trim() 即可)

複製程式碼 程式碼如下:

 String.prototype.trim = function (trim = function (trim = function >return this .replace(/^ss*/, '' ).replace(/ss*$/, '' );
 }

看起來不怎麼樣,動用了兩次正則替換,實際速度很是驚人,主要得益於瀏覽器的內部優化。一個著名的例子字串拼接,直接相加比用Array做成的StringBuffer還快。 base2類別庫施用這種實作。

實現2

複製程式碼 程式碼如下:
 String.prototype.trim = function (trim = function (trim = function (trim = function >return this .replace(/^s /, '' ).replace(/s $/, '' );
 }


和實現1很相似,但稍慢一點,主要原因是它最先是假設至少存在一個空白符。 Prototype.js施用這種實作,不過其名兒為strip,因為Prototype的方法都是試圖與Ruby重名。

實現3

複製程式碼 程式碼如下:
 String.prototype.trim = function (trim = function (trim = function >returnthis .substring(Math.max( this .search(/S/), 0), this .search(/Ss*$/) 1);
 }



以截取方式取得空白部分(當然允許中間存在空白符),總共呼叫了4個原生方法。預設得很是巧妙,substring以兩個數字作為參數。 Math.max以兩個數位作參數,search則歸回一個數字。速度比上邊兩個慢一點,但比下面大大都快。
實現4

複製程式碼 程式碼如下: String.prototype.trim = function (trim = function (trim = function >returnthis .replace(/^s |s $/g, '' );
 }



這個可以稱得上實現2的簡化版,就是利用候選運算子連接兩個正規。但這樣做就落空了瀏覽器優化的機會,比不上實現3。由於看來很優雅,許多類別庫都施用它,如JQuery與mootools
實現5

複製程式碼

程式碼如下: String.prototype.trim = function (trim = function (trim = function (trim = function >var str = this ;str = str.match(/S (?:s S )*/);
return str ? str[0] : '' ;
 }



match是歸回一個陣列,是以原字串切合要求的部分就成為它的元素。為了防止字串中間的空格符號被解除,咱們需要動用到非捕獲性分組(?:exp)。由於數組可能為空,咱們在後面還要做進一步的判定。好像瀏覽器在處理分組上比力無力,一個字慢。所以不要迷信正則,雖然它基本上是萬能的。

實現6

複製程式碼


把切合要求的部分提供出來,放到一個空字串中。不過效率很差,尤其是在IE6。

實現7

複製程式碼

程式碼如下: String.prototype.trim = function (trim = function (trim = function >return this .replace(/^s*(S*(?:s S )*)s*$/, '$1' ); } 

和實現6很相似,但用了非捕獲分組進行了優點,性能效之有一點點提升。

實現8

複製程式碼 程式碼如下:

 String.prototype.trim = function (trim = function (trim = function >return this .replace(/^s*((?:[Ss]*S)?)s*$/, '$1' );
 }
 
沿著上邊兩個的思路進行改進,動用了非捕獲分組與字符集合,用?頂替了*,效果很是驚人。尤其在IE6中,可以用瘋狂來形容這次性能的提升,直接秒殺火狐。

實現9

複製程式碼 程式碼如下:
 String.prototype.trim = function (trim = function (trim = function >return this .replace(/^s*([Ss]*?)s*$/, '$1' );
 }
 

這次是用懶惰匹配頂替非捕獲分組,在火狐中得到改善,IE沒有上次那麼瘋狂。

實現10

複製程式碼 程式碼如下:
 String.prototype.trim = function (trim = function (trim = function >var str = this ,
whitespace = ' nrtfx0bxa0u2000u2001u2002u2003u2004u20 05u2006u2007u2008u2009u200au20020F str.length; i = 0; i--) {
if (whitespace.indexOf (str.charAt(i)) === -1) {
str = str.substring(0, i 1);
break ;
}
}
return whitespace.indexOf (str.charAt(0)) === -1 ? str : '' ;
 }



我只想說,搞出這個的人已不是用牛來形容,已是神一樣的等級。它先是把可能的空白符全部列出來,在第一次遍歷中砍掉前邊的空白,第二次砍掉後面的空白。全過程只用了indexOf與substring這個專門為處理字串而生的原生方法,沒有施用到正規。速度快得驚人,預計直逼上內部的二進制實現,並且在IE與火狐(其它瀏覽器當然也毫無疑問)都有傑出的表現。速度都是零毫秒另外。
實現11

複製程式碼

程式碼如下: String.prototype.trim = function (trim = function (trim = function >var str = this ,str = str.replace(/^s /, '' );
for ( var i = str.length - 1; i >= 0; i--) {
if (/S/.test(str.charAt(i))) {
str = str.substring(0, i 1);
break ;
}
}
return str;
 }



實現10已告訴咱們普通的原不認識的字符串截取方法是遠勝於正則替換,雖然是複雜一點。但只要正則不過於複雜,咱們就可以利用瀏覽器對正則的優化,改善程序執行效率,從實現8在IE的表現。我想通常不會有人在專案中應用實現10,因為那個whitespace 實現過長太難記了(當然如果你在打造一個類別庫,它絕對是起首)。實現11可謂其改進版,前邊部分的空白由正則替換負責砍掉,後面用原生方法處理,效果不遜於原版,但速度都是很是逆天。

實現12

複製程式碼

i = str.length;
while (ws. test(str.charAt(--i)));
return str.slice(0, i 1);
 }

实现10与实现11在写法上更好的改进版,注意说的不是性能速度,而是易记与施用上。和它的两个先辈都是零毫秒级另外,以后就用这个来工作与吓人。

下面是老外给出的比力结果,执行背景是对Magna Carta 这文章(超过27,600字符)进行trim操作。

实现 Firefox 2 IE 6

trim1 15ms trim2 31ms trim3 46ms 31ms
trim4 47ms 46ms
trim5 156ms 1656ms
trim6 172ms 2406ms
trim7 172ms 1640ms
trim8 281ms trim9 125ms 78ms

trim10 trim11 trim12 trim函数实现揭晓自己的想法,想懂得原作者说什么请看原文。



JS 去除空格的方法目前共有 12 種:

實作 1
String.prototype.trim = function() { return this.replace(/^ss*/, '' ).replace(/ss*$/, ''); }
實作2
String.prototype.trim = function() { return this.replace(/^s /, '').replace(/s $/, ''); }
實作3
String.prototype.trim = function() { return this.s string(Math.max(this.search(/S/), 0),this.search(/Ss*$/ ) 1); }
實作4
String.prototype.trim = function() { return this.replace(/^s |s $/g, ''); }
String.prototype.trim = function() { var str = this; str = str.match(/S (?:s S )*/);回傳 str ?字串[0]:''; }
String.prototype.trim = function() { return this.replace(/ ^s*(S*(s S )*)s*$/, '$1'); }
實作7
String.prototype.trim = function() { return this.replace(/^s*(S*(?:s S )*)s*$/, '$1'); }
String.prototype.trim = function() { return this.replace(/^s*((?:[Ss]*S)?)s*$/, '$1'); }
String.prototype.trim = function() { return this.replace(/^s*([Ss]*?)s*$/, '$1'); }
String.prototype.trim = function() { var str = this,whitespace = ' nrtfx0bxa0??????????????? '; for (var i = 0,len = str.length; i = 0; i--) { if (whitespace.indexOf(str.charAt(i)) === -1) { str = str.s string( 0, 我1);休息;回傳whitespace.indexOf(str.charAt(0)) === -1 ?字串:''; }
實作11
String.prototype.trim = function() { var str = this, str = str.replace(/^s /, ''); for (var i = str.length - 1; i >= 0; i--) { if (/S/.test(str.charAt(i))) { str = str.s string(0, i 1 ) ;休息;返回str; }
實作12
String.prototype.trim = function() { var str = this, str = str.replace(/^ss*/, ''), ws = /s /, i = str.長度; while (ws.test(str.charAt(--i)));回傳str.slice(0, i 1); }

看起來不太怎麼樣,動用了兩次正規替換,實際上速度非常驚人,主要得益於瀏覽器的內部優化。實作。都是力求與Ry同名。 max以兩個數字作參數,搜尋則回傳一個數字。操作符連接兩個則。

符合是傳回一個陣列因此,原字串符合要求的部分就成為它的元素。由於備份可能崩潰,我們在後面還需要進一步的對策。 🎜>
把符合要求的提供部分拿出來,放到一個空字符串中。 不過效率很差,尤其是在IE6中。分組進行了優點,性能效率之有一點點提升。 *,效果非常驚人。包,在火狐中得到改善,IE上次沒有那麼瘋狂。等級了。使用到正則。 🎜>實現10已經告訴我們普通的清晰弦截取方法是遠勝於正則替換,雖然是複雜一點。的表現中實現8。實現11可謂其改進版,前面部分的空白由正則替換負責砍掉,後面用原生方法處理,效果不遜 於原版,但速度都是非常逆天。

實現10與實現11在寫法上更好的改良版,注意說的不是性能速 度,而是易記與使用上。和它的兩個前輩都是零毫秒等級的,以後就用這個來工作與嚇人。
陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn