Question

对于具有类the_name的每个元素，我想提醒该元素内的值。因此，对于下面的代码，它应该警告三次。每一个用于：“苹果”，“梨子”和“李子”。

不确定我在这里缺少什么。

var arr = $('.the_name');
for(var i = 0; i < arr.length; i++){
  alert(arr[i].val());  
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<table id="datatable">
	<thead>
		<tr>
			<th></th>
			<th>Fruits</th>
		</tr>
	</thead>
	<tbody>
		<tr>
			<td class="the_name">Apples</td>
			<td class="the_count">3</td>
		</tr>
		<tr>
			<td class="the_name">Pears</td>
			<td class="the_count">2</td>
		</tr>
		<tr>
			<td class="the_name">Plums</td>
			<td class="the_count">5</td>
		</tr>
		<tr>
			<td>Bananas</td>
			<td>1</td>
		</tr>
		<tr>
			<td>Oranges</td>
			<td>2</td>
		</tr>
	</tbody>
</table>

Answer 1

通过索引访问jQuery对象，您需要检索底层DOMElement，而不是jQuery对象，并且它们没有val()方法。另请注意，您似乎希望检索元素的文本，而不是值。因此，您应该使用each()循环选定的元素，使用this来引用当前迭代的元素。试试这个：

$('.the_name').each(function() {
    alert($(this).text());  
});

另请注意，出于调试目的，应使用console.log()代替alert()。

＆＃13;

$('.the_name').each(function() {
  alert($(this).text());
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<table id="datatable">
  <thead>
    <tr>
      <th></th>
      <th>Fruits</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td class="the_name">Apples</td>
      <td class="the_count">3</td>
    </tr>
    <tr>
      <td class="the_name">Pears</td>
      <td class="the_count">2</td>
    </tr>
    <tr>
      <td class="the_name">Plums</td>
      <td class="the_count">5</td>
    </tr>
    <tr>
      <td>Bananas</td>
      <td>1</td>
    </tr>
    <tr>
      <td>Oranges</td>
      <td>2</td>
    </tr>
  </tbody>
</table>

＆＃13;

Answer 2

您需要使用.text()代替.val() .val()适用于输入元素（或具有值属性的任何元素？），.text()不适用于输入元素。 .val()获取input元素的值 - 无论类型如何。 .text()获取所有匹配元素的innerText（而不是HTML）：

.text()

结果是包含的字符串所有的组合文本内容匹配的元素。这种方法有效 HTML和XML文档。不可能是用于输入元素。用于输入字段文本使用val属性。

.val()

获取value属性的内容第一个匹配的元素

您需要使用$使用jquery方法.text()。

var arr = $('.the_name');
for(var i = 0; i < arr.length; i++){

  alert($(arr[i]).text());
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<table id="datatable">
	<thead>
		<tr>
			<th></th>
			<th>Fruits</th>
		</tr>
	</thead>
	<tbody>
		<tr>
			<td class="the_name">Apples</td>
			<td class="the_count">3</td>
		</tr>
		<tr>
			<td class="the_name">Pears</td>
			<td class="the_count">2</td>
		</tr>
		<tr>
			<td class="the_name">Plums</td>
			<td class="the_count">5</td>
		</tr>
		<tr>
			<td>Bananas</td>
			<td>1</td>
		</tr>
		<tr>
			<td>Oranges</td>
			<td>2</td>
		</tr>
	</tbody>
</table>

Answer 3

jQuery对象的索引值是HTML元素，而不是jQuery对象。

您必须先将它们包装在jQuery对象中，然后才能在它们上调用jQuery方法：

var arr = $('.the_name');
for(var i = 0; i < arr.length; i++){
  var html_element = arr[i];
  var $html_element = $(html_element);
  alert($html_element.val());  
}

对于类中的每个元素，console.log的值为

3 个答案: