|
|
在開始之前，我想先花一點(diǎn)時(shí)間來看一下字符串函數(shù)是怎么調(diào)用的。在我的例子中，我是在字符串變量上面直接調(diào)用這個(gè)方法的，就像下面的這樣：
參考代碼：
復(fù)制代碼 代碼如下:
var my_text_variable = "Heres some text";
// 結(jié)果 字符串變量 方法名
var result_of_function = my_text_variable.someStringFunction();
但是我這樣寫只是為了能夠更清楚地解釋它，你應(yīng)該了解到這些字符串函數(shù)也可以直接在字符串上調(diào)用，而不需要聲明一個(gè)變量，就像這樣：
參考代碼： 復(fù)制代碼 代碼如下:
var result_of_function = "Heres some text".someStringFunction();
注意一下，這個(gè)方式在MooTools中的數(shù)字處理函數(shù)也同樣有效：
參考代碼： 復(fù)制代碼 代碼如下:
// 注意一下用法，是括號中的數(shù)字
// 而不是單引號引起來的字符串
var limited_number = (256).limit(1, 100);
還有，我想再次強(qiáng)調(diào)一遍：用JavaScript對輸入過濾并不能在數(shù)據(jù)發(fā)送到服務(wù)器之前對其進(jìn)行安全過濾。你在JavaScript中寫的所有的一切都可以被你的網(wǎng)頁瀏覽者看到、操控和禁止。我們將在以后講MooTools的Request類時(shí)，對php的過濾技術(shù)進(jìn)行一些簡單的探討。同時(shí)，繼續(xù)保持原來要在服務(wù)器端做的任何與安全相關(guān)的事情，不要依賴JavaScript。
trim()
trim函數(shù)提供了一個(gè)簡單直接的方式來去掉任何你想處理的字符串兩端的空白字符。
參考代碼：
復(fù)制代碼 代碼如下:
// 這是我們要trim的字符串
var text_to_trim = " /nString With Whitespace ";
// trim后的字符串是"String With Whitespace"
var trimmed_text = text_to_trim.trim();
如果你還沒有見過/n，其實(shí)這只是一個(gè)換行符而已。你可以在一個(gè)字符串中使用它來把字符串分割成多行。trim方法把換行符也當(dāng)作一個(gè)空白符，因此它也會把換行符去掉。trim方法唯一不做的一件特別的事情就是：它并不會去掉一個(gè)字符串里面的任何多余的空白字符。下面的這個(gè)例子展示了trim是怎樣處理字符串里面的換行符的：
參考代碼： 復(fù)制代碼 代碼如下:
var trimDemo = function(){
// 設(shè)置我們要修剪的字符串
var text_to_trim = ' /ntoo much whitespace/n ';
// 對其進(jìn)行修剪
var trimmed_text = text_to_trim.trim();
// 顯示結(jié)果
alert('Before Trimming : /n' +
'|-' + text_to_trim + '-|/n/n' +
'After Trimming : /n' +
'|-' + trimmed_text + '-|');
}
clean()
為了更有意義，你也許不需要去掉一個(gè)字符串里的所有空白符。幸運(yùn)的是，對于那些你覺得堅(jiān)強(qiáng)的空白字符，MooTools慷慨地為你提供了clean()方法。
參考代碼：
復(fù)制代碼 代碼如下:
// 這是我們要修剪的字符串
var text_to_clean = " /nString /nWith Lots /n /n More /nWhitespace /n ";
// clean以后的字符串是"String With Lots More Whitespace"
var cleaned_text = text_to_trim.clean();
clean()方法與trim()方法有一點(diǎn)很大的不同。它把你傳入的字符里面的空格全部提取出來，而不只是頭部和尾部的空白字符。它們意味著字符串中的任何多于一個(gè)的空白字符和任何換行符和制表符（tab）。對比一下修剪的結(jié)果，我們看看到底是什么意思：
參考代碼：
復(fù)制代碼 代碼如下:
var cleanDemo = function(){
// 設(shè)置我們要修剪的字符串
var text_to_clean = ' too/n much/n whitespace ';
// clean該字符串
var cleaned_text = text_to_clean.clean();
// 顯示結(jié)果
alert('Before Cleaning : /n' +
'|-' + text_to_clean + '-|/n/n' +
'After Cleaning : /n' +
'|-' + cleaned_text + '-|');
}
contains()
和trim()以及clean()方法類似，contains()方法做一件很簡單的事情，沒有任何其他的花架子。它檢查一個(gè)字符串去看它是否包含一個(gè)你要查找的字符串，如果找到了要查找的字符串就返回true，如果沒有找到就返回false。
參考代碼：
復(fù)制代碼 代碼如下:
// 我們要在這個(gè)字符串里面查找
var string_to_match = "Does this contain thing work?";
// 找'contain', did_string match為true
var did_string_match = string_to_match.contains('contain');
// 找'propane', did_string_match為 false
did_string_match = string_to_match.contains('propane');
這個(gè)方法可以在各種情況下派上用場，當(dāng)你和其他工具，如我們在第三講中講到的Array.each()函數(shù)配合使用時(shí)，你可以用相對較少的代碼來完成一些稍微復(fù)雜的任務(wù)。舉個(gè)例子，如果我們把一系列單詞放進(jìn)一個(gè)數(shù)組，然后一個(gè)一個(gè)地遍歷，我們可以用較少的代碼在一個(gè)文本的相同區(qū)域中尋找多個(gè)單詞：
參考代碼：
復(fù)制代碼 代碼如下:
string_to_match = "string containing whatever words you want to try to match";
word_array = ['words', 'to', 'match'];
// 把數(shù)組中的每一個(gè)單詞作為變量傳進(jìn)去
word_array.each(function(word_to_match){
// 尋找當(dāng)前的單詞
if (string_to_match.contains(word_to_match)){
alert('found ' + word_to_match);
};
});
我們把它放進(jìn)一個(gè)textbox中，加一點(diǎn)想象，你就可以擁有你自己的臟詞（或者其他任何）檢測器。
參考代碼：
復(fù)制代碼 代碼如下:
var containsDemo = function(){
// 把我們要禁止的詞放進(jìn)一個(gè)數(shù)組
var banned_words = ['drat', 'goshdarn', 'fiddlesticks', 'kumquat'];
// 獲得文本域中的內(nèi)容
var textarea_input = $('textarea_1').get('value');
// 枚舉過濾詞中的每一個(gè)詞
banned_words.each(function(banned_word){
// 在文本域內(nèi)容中查找當(dāng)前的過濾詞
if (textarea_input.contains(banned_word)){
// 告訴用戶不能使用那個(gè)單詞
alert(banned_word + ' is not allowed');
};
});
}
substitute()
substitute()是一個(gè)非常強(qiáng)大的工具。我們今天只是講一下一些關(guān)于它的基本知識，substitute的更多強(qiáng)大的功能來自于它的正則表達(dá)式的使用，我們會在后面稍微講一下。然而，僅僅使用這些基本功能你就可以做很多事情了。
參考代碼：
復(fù)制代碼 代碼如下:
// 這是要使用substitute方法的文本模板
// 注意，要替代的部分都是用花括號括起來的部分
var text_for_substitute = "One is {one}, Two {two}, Three is {three}.";
// 這個(gè)對象包含了要替換的規(guī)則
// 沒有用引號引起來的部分是搜索項(xiàng)
// 用引號引起來的部分是用來替換搜索項(xiàng)的句子
var substitution_object = {
one : 'the first variable',
two : 'always comes second',
three : 'getting sick of bronze..'
};
// 在text_for_substitute上調(diào)用substitute方法
// 把substitution_object作為參數(shù)傳入
// 把替換結(jié)果賦值給變量new_string
var new_string = text_for_substitute.substitute(substitution_object);
// new_string現(xiàn)在的值為"One is the first variable, Two always comes second, Three is getting sick of bronze..."
事實(shí)上你并不需要?jiǎng)?chuàng)建一個(gè)substitution_object對象來使用substitute方法，如果你覺得它不合適的話，下面的方法也同樣可以實(shí)現(xiàn)：
參考代碼：
復(fù)制代碼 代碼如下:
// 建立要替換的字符串
var text_for_substitute = "{substitute_key} and the original text";
// 把要替換的對象作為參數(shù)傳給substitute方法
var result_text = text_for_substitute.substitute({substitute_key : 'substitute_value'});
// result_text現(xiàn)在就是"substitute_value and the original text"
你可以通過這個(gè)方法做得更多更深入一點(diǎn)，你可以用從一個(gè)DOM對象中獲得值的函數(shù)調(diào)用來作為替換項(xiàng)的值，這也是可以的。
參考代碼：
復(fù)制代碼 代碼如下:
var substituteDemo = function(){
// 從textfield中獲得原始的 文本
var original_text = $('substitute_span').get('html');
// 用文本框中的值替換textfield中的值
var new_text = original_text.substitute({
first : $('first_value').get('value'),
second : $('second_value').get('value'),
third : $('third_value').get('value'),
});
// 用新的文本替換span中的內(nèi)容
$('substitute_span').set('html', new_text);
// 禁用substitute按鈕
// 并啟用reset按鈕
$('simple_substitute').set('disabled', true);
$('simple_sub_reset').set('disabled', false);
}
var substituteReset = function(){
// 創(chuàng)建一個(gè)變量來保存原有的文本
var original_text = "|- {first} -- {second} -- {third} -|";
// 用原有的文本來替換span中的內(nèi)容
$('substitute_span').set('html', original_text);
// 禁用reset按鈕
// 并啟用substitute
$('simple_sub_reset').set('disabled', true);
$('simple_substitute').set('disabled', false);
}
|- {first} -- {second} -- {third} -|
first_value
second_value
third_value
在今天結(jié)束之前，有一個(gè)很小的提示，如果你在一個(gè)字符串上調(diào)用substitute方法，并且不為要替換的關(guān)鍵字提供一個(gè)鍵/值對（key/value pair）對象，那么它將只是簡單地刪除掉花括號里面的內(nèi)容。因此，如果你需要保留花括號里面的字符串，請注意不要使用這個(gè)方法。舉個(gè)例子，如下：
參考代碼：
復(fù)制代碼 代碼如下:
("{one} some stuff {two} some more stuff").substitute({one : 'substitution text'});
這將返回“substitution text some stuff some more stuff”。
更多學(xué)習(xí)
下載一個(gè)包含你開始所需要的zip包
- String上的怪異模式（this guy is amazing）
- JavaScript字符串函數(shù)參考
- MooTools字符串文檔
JavaScript技術(shù)：Mootools 1.2教程 輸入過濾第二部分（字符串），轉(zhuǎn)載需保留來源！
鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請第一時(shí)間聯(lián)系我們修改或刪除，多謝。
