JQuery Selector

Question

У меня довольно простая динамическая html-структура таблицы, которая содержит ссылки и возможность того, что она будет содержать вторую таблицу со ссылками.Я хотел бы изменить атрибут html для ссылок в основной таблице, но не во второй.

Моя структура:

<table>
<tr><td><a href="www.google.com">link</a></td></tr>
<tr><td><a href="www.google.com">link</a></td></tr>
<tr><td><a href="www.google.com">link</a></td></tr>
<tr><td><a href="www.google.com">link</a></td></tr>
<tr><td><a href="www.google.com">link</a></td></tr>
<tr>
    <td>
        <table>
            <tr><td><a href="http://stackoverflow.com">link</a></td></tr>
            <tr><td><a href="http://stackoverflow.com">link</a></td></tr>
            <tr><td><a href="http://stackoverflow.com">link</a></td></tr>
        </table>
    </td>
</tr>

Так, например, яхотел бы изменить все ссылки на "www.google.com" на "www.foo.com".Я могу изменить атрибут href, но у меня возникают проблемы с моим селектором b / c, в некоторых случаях вторая таблица не существует.

Мой текущий селектор выглядит так: $('table a').filter(':not(table:last a)')

Я уверен, что это не самый эффективный способ сделать это, но он работал до тех пор, пока в игру не вступил второй стол.,

Answer 1

Если ваша «основная» таблица не находится внутри другой таблицы, вы можете сделать:

$('table a:not(table table a)')

или эквивалентно:

$('table a').not('table table a')

Обновление: С точки зрения производительности, Ответ Патрика намного лучше.

Answer 2

Я думаю, что лучше сделать это:

$('table').slice( 0, -1 ).find( 'a' );

Найти все таблицы, затем уменьшить набор до всех, кроме последнего, и, наконец, сделать .find() для элементов <a>.

Причина в том, что я сильно склонен к действительным селекторам CSS, так что jQuery может успешно использовать querySelectorAll.

Answer 3

Если вы можете изменить динамически сгенерированный HTML, вам действительно следует присвоить каждой таблице свойство ID:

<table id="table1"> ...
    <table id="table2"> ...
    </table>
</table>

Тогда ваши селекторы могут быть просто

$('#table1').find('a')

Это на самом деле не отвечает на ваш вопрос, но этот дизайн гораздо проще в обслуживании и его легче изменить.

Answer 4

Попробуйте использовать дочерний селектор и присвоить главной таблице идентификатор (если у него его еще нет):

$('#maintable > tbody > tr > td > a')

Где #maintable - это идентификатор вашегоглавная таблица.

Редактировать: Вы также захотите добавить тег <tbody> в таблицу (по причинам, указанным в комментариях).

Используетсяосновные селекторы CSS в новых браузерах и не требуют никакой магии jQuery, если вы не используете более старый браузер.

Answer 5

Вы можете сделать с контейнером вашего стола.
Если это тело:

$ ("body> table> tr> td> a")