Question

<head>
    <script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>

    <script type="text/javascript" > 
            $(function () {
                alert($('tr').html());
            })
    </script>

</head>
<body>
    <table>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>      
        </tr>   
        <tr>
            <td>4</td>
            <td>5</td>
            <td>6</td>
        </tr>
    </table>
</body>

我有一个简单的HTML表格。在一个JQuery脚本中，我试图警告表中的所有行，但它只警告一行表。 $('tr')实际返回了什么？

如果$('tr').css('background-color', 'red');可以更改所有行的颜色，为什么不能显示所有行？

Answer 1

html() ：获取匹配元素集中第一个元素的HTML内容，或设置每个匹配元素的HTML内容。

您可以使用each()遍历所有行，并使用alert显示html内容：

$('tr').each(function(){
    alert($(this).html());
});

希望这有帮助。

$(function () {
    $('tr').each(function(){
        alert($(this).html());
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>      
  </tr>   
  <tr>
    <td>4</td>
    <td>5</td>
    <td>6</td>
  </tr>
</table>

Answer 2

您需要获取每个tr的html并在两个警报中显示html。这将显示您的tr是两条警报消息：

<强> SCRIPT

 $(function () {
     $('tr').each(function() {
          alert($(this).html());
     });
 });

请参阅以下工作示例：https://jsfiddle.net/4qb4j6s1/1/

$('tr').css('background-color', 'red');更改所有tr背景颜色的原因是因为jquery function css应用于元素的所有实例，除非另有说明。 Alert();仅显示html元素的第一个实例！

为了在一个警报中显示整个表格，您可以这样做：

<强> SCRIPT

alert($('table').html());

Answer 3

观看有关jquery的.html（）方法的文章：

http://api.jquery.com/html/

返回第一个匹配项的html！

`alert（$（＆＃39; table tr＆＃39;）。html（））;`只显示一行表

3 个答案: