如何<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操作。