jQuery在子div中获取值

I need to grab the text value of a child div.

我需要抓住一个子div的文本值。

<div id='first'>
    <div id='first_child'>A</div>
    <div id='second_child'>B</div>
    <div id='third_child'>C</div>
</div>

I am trying to grab the value B. I am currently trying this but it is not working,

我试图抓住价值B.我正在尝试这个，但它不起作用，

var text_val = $('#first').next('#second_child').val();

8 个解决方案

#1

You want to use children() and text() instead of val(). Although, since what you are selecting has an id (and ids must be unique), you could also simply select based on the id without involving the container element at all.

您想使用children（）和text（）而不是val（）。虽然，因为您选择的内容具有id（并且ID必须是唯一的），您也可以根据id选择而不涉及容器元素。

The val() method only works on input elements, textareas, and selects -- basically all form elements that contain data. To get the textual contents of a container, you need to use text() (or html(), if you want the mark up as well).

val（）方法仅适用于输入元素，textareas和choose - 基本上所有包含数据的表单元素。要获取容器的文本内容，您需要使用text（）（或html（），如果您还想要标记）。

var text_val = $('#second_child').text(); //preferred

要么

var text_val = $('#first').children('#second_child').text(); // yours, corrected

#2

next() and nextAll() traverse the siblings of the element, not the children. Instead, use "find()"

next（）和nextAll（）遍历元素的兄弟，而不是子元素。相反，使用“find（）”

var text_val = $('#first').find('#second_child').html();

You use val() when dealing with elements like inputs and textareas. html() will return whatever is under the div (which works in your example). text() will return the text in the element (wich would also work in your example).

在处理输入和textareas等元素时使用val（）。 html（）将返回div下的任何内容（在您的示例中有效）。 text（）将返回元素中的文本（在您的示例中也可以使用）。

Your example also makes me suspicious of your design. If you have multiple ids set to "#second_child", your html is confused. Instead, use a class. However, if there's only one id "#second_child", then all you need is:

你的例子也让我怀疑你的设计。如果您将多个ID设置为“#second_child”，则您的html会感到困惑。相反，使用一个类。但是，如果只有一个id“#second_child”，那么您只需要：

var text_val = $('#second_child').text();

#3

you can simply:

你可以简单地说：

var text_val = $('#second_child').text();

as pointed by previous answers. but, since you "need to grab the text value of a child div", i assume that the child div id probably not always available. you can try this instead:

如先前的答案所指出的那样但是，既然你“需要获取子div的文本值”，我认为子div id可能并不总是可用。你可以试试这个：

var text_val = $('#first').children().eq(1).text();

where 1 is the index of the child div (since it count starts from zero)

其中1是子div的索引（因为它从零开始计数）

#4

Try this...

尝试这个...

var text_val = $('#first > #second_child').text();

#5

Simple,

简单，

var text_val = $('#second_child').text();

Or your change,

或者你的改变，

var text_val = $('#first').children('#second_child').text();

This will return "B" from div of id "second_child"

这将从id“second_child”的div返回“B”

UPDATE Changed the second solution to children() instead of nextAll().

更新将第二个解决方案更改为children（）而不是nextAll（）。

#6

For multiple elements with the same id:

对于具有相同ID的多个元素：

var text_val = $('#first').children('#second_child').text();

For a single element with a particular id:

对于具有特定id的单个元素：

var text_val = $('#second_child').text();

#7

........

var text_val = $('#first').children('#second_child').text();

#8

If you need to go into lists, use this:

如果您需要进入列表，请使用：

jQuery('.first > ul > li:nth-child(6)').text();

jQuery（'。first> ul> li：nth-child（6）'）。text（）;

Example code gets the value of the 6th item in a list.

示例代码获取列表中第6项的值。

#1