JQuery: удаление все после того, как элемент

Question

У меня есть HTML-код, как это:

<li> 
<a href=''>Example</a>&nbsp;<a href='' class='sub'>Edit</a>&nbsp;<a href='' class='sub'>Delete</a> 
</li> 

, и я хочу, чтобы удалить все после первого </a>, включая пробелы. Какой самый элегантный и простой способ сделать это? я достиг своей цели со следующим JQuery:

$('li').children(".sub").remove();  
$('li').html($('li').html().replace(/ /g,'')); 

но вторая линия выглядит слишком много, как взломать. Есть ли способ лучше?

Answer 1

Вы можете попробовать:

$('li').html($('li a:first-child')); 

Answer 2

Вы могли бы сделать что-то вроде этого, вместо:

$('li a:first-child').each(function() { 
    $(this).parent().html(this); 
});​ 

Это вычистить родитель, включая обработчик событий на этих элементах затем положить первую <a> спину. Он также будет поддерживать любые обработчики событий на якоре, который вы держите, you can give it a try here. Передача элемента DOM в .html() составляет a shortcut для .empty() и .append(), что делает его немного более кратким.

Answer 3

Как насчет этого?

$('li').html($('li').find("a:first").html()) 

EDIT 1: вышеуказанный код является неправильным. Попробуйте следующее:

$('li').find("a:first").appendTo($('li').html("")); 

Спасибо, Ник.

Answer 4

Самый простой способ - это, возможно, обернуть ссылки «Редактировать/Удалить», которые вы хотите удалить внутри div (или другого элемента по вашему выбору), а затем удалить все сразу. Вы почти там с первой строкой кода.

Вместо того, чтобы класс = «суб» на каждый якоре, вы могли бы вместо того, чтобы сделать что-то вроде:

<li> 
<a href=''>Example</a><div class='sub'>&nbsp;<a href=''>Edit</a>&nbsp;<a href=''>Delete</a></div> 
</li> 

И тогда вам придется:

$('li').children(".sub").remove(); 

Так же, как вы сейчас делаете , и он должен удалить div с пробелами.