как изменить текст между <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

Это хорошо использовать для версии .text()function argument:

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

аргумент функции версии многих функций JQuery особенно подходят для операций «чтение-модификация-запись».

Они избегают необходимости писать отдельный код для чтения значение, изменить его, а затем написать значение обратно в 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.