如何<li><a></a></li>

Question

對不起之間切換文本愚蠢的問題，但我不能算出它（初級）

我有一個UL列表中包含項目：

<div id="some_list"> 
<li ><a href="#">Hardware &ndash; HP Proliant DL145G2 AAA</a> 

哪有我將OnClick AAA更改爲BBB？

我認爲函數應該調用$（document）.ready，但我不知道函數change_list中應該做什麼。

<script type="text/javascript"> 
function change_list(aaa){ 
... 
} 
$(document).ready(function() { 
    $('#some_list li a').click(change_list); 
}); 

Answer 1

這是function argument版本的.text()一個良好的使用：

很多jQuery的功能

$('#some_list li a').click(function() { 
    $(this).text(function(index, text) { 
     return text.replace('AAA', 'BBB'); 
    }); 
}); 

功能參數版本是特別適合於「讀 - 修改 - 寫」操作。

他們避免需要編寫不同的代碼來閱讀值，修改，然後寫值回DOM。

另一種選擇將是這個樣子的：這個現在

$('#some_list li a').click(function() { 
    var oldText = $(this).text(); 
    var newText = oldText.replace('AAA', 'BBB'); 
    $(this).text(newText); 
}); 

注意如何調用.text()兩次 - 一次檢索值，然後再寫入新的價值。

在這種情況下，節省的成本並不高，但是當您想修改屬性或CSS值等內容時，該方法特別有用，因爲它避免了大量的代碼重複。

函數參數方法的另一個優點是它允許您從DOM操作中分離邏輯。您可以編寫僅關注修改字符串的簡單修改函數，並讓jQuery處理DOM操作。