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