У меня проблема с выбором элемента в jQuery

Question

Я использую selectorgadget , чтобы помочь мне выбрать элементы в документе. Но когда я использовал его на jQuery, он не работает. Селектор n-го ребенка, кажется, не работает для меня.

<div id = "wrap">
<div class = "book">
    <div class = "chapter">
        <p class = "text">
            <table>
                <tbody>
                    <tr>
                        <td>Title</td>
                        <td>
                            <b>jQuery</b>
                        </td>
                    </tr>
                </tbody>
            </table>
        <p>
    </div>
</div>
</div>

HTML выше. Есть много книжных классов. Div wrap - это оболочка, которая заключила их всех. Селектор гаджета сказал, что при использовании:

$("#wrap tr:nth-child(1) b") Следует выбрать элемент TD с тегом <b>. Поэтому следует выбрать «jQuery».

Я попробовал, но это не сработало. Когда я попробовал:

var query = $("#wrap tr:nth-child(1) b").text();
alert(query);

Браузер отправляет предупреждение без текста. И когда я попробовал:

var query = $("#wrap tr:nth-child(1) b").html();
alert(query);

Браузер отправляет нулевое предупреждение.

Что не так?

Answer 1

Я пробовал это с FF 3.0.10, jQuery 1.3.2, greasemonkey 0.8.2

var query = $("#wrap tr:nth-child(2) b").text();
returns "jQuery"

2 в nth-child () добивается цели !! Индекс для n-го ребенка начинается с 1, а не с 0

Answer 2

Вам нужен nth-child (2),: nth-child (1) выбирает заголовок. Помните, что: eq основан на 0, а nth-child () основан на 1. Смешение!

Answer 3

При тестировании вашего образца в Firefox 3 и IE8 я смог вернуть текст, который вы ожидали, используя ваш селектор после одной настройки - я добавил идентификатор «wrap» для вашего элемента таблицы:

<table id="wrap">

Как только это было добавлено, ваш селектор, казалось, работал просто отлично. У вас есть проблемы с конкретной платформой?

Answer 4

Я только что попробовал ваш пример кода, и он сразу заработал. Какую версию jQuery вы используете? Работает в 1.3.2

Вот рабочий пример: http://jsbin.com/uzuzu/edit

Answer 5

вы пробовали

изменено, я сначала не заметил tr: nth-child, в этой таблице нет 1 дочернего tr, но есть индекс с индексом 1

var query = $(".text td:nth-child(1) b").html();
alert(query);