Question

我正在尝试将表传递给函数，然后使用jQuery获取行。我在这里做错了什么？

sortTable($('#myTable'));


function sortTable(targetTable)
{
    var rows = $(targetTable + ' tr');
}

错误：未捕获的错误：语法错误，无法识别的表达式：[object Object] .tr

Answer 1

我认为问题出在这里

sortTable($('#myTable'));

您要传递targetTable和jQuery object，因此将其添加到字符串中会强制其变成字符串，即[object Object]。我想你是说：

sortTable('#myTable');

function sortTable(targetTableSelector) {
   var rows = $(targetTableSelector+ ' tr');
}

Answer 2

您可以使用.find()：

var rows = targetTable.find("tr");

这将从表开始查找所有<tr>元素，并为您提供一个包含它们的新jQuery对象。

您可以获得用于构造jQuery对象的选择器：

var tableSelector = targetTable.selector;

在这种情况下，它将是字符串"#myTable"。但是，jQuery对象并不总是由选择器构成。如果通过诸如事件处理程序之类的方法获取对表DOM节点的引用，则不会有选择器。您仍然可以使用.find()从“起点” jQuery对象中定位元素。

请注意，.find()对jQuery初始集合中的所有元素 all 起作用。如果您的初始对象是包含两个<table>元素的集合，那么.find("tr")将在两个表下找到所有行。

Answer 3

您传递的jQuery对象。不是id。这意味着当您将id连接到targetTable参数时，您将得到：

[object Object] tr

因此，您将尝试选择：

$("[object Object] tr")

这不是您想要的。相反，您需要将表id传递到函数中，以便用字符串而不是对象将其连接起来。

请参见下面的工作示例：

function sortTable(targetTable) {
    var rows = $(targetTable + ' tr').toArray();
    return rows.toArray();
}

console.log(sortTable('#myTable'));

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table id="myTable" border=1>
  <tr>
    <th>Name</th>
    <th>Age</th>
  </tr>
  <tr>
    <td>Bob</td>
    <td>23</td>
  </tr>
  <tr>
    <td>John</td>
    <td>33</td>
  </tr>
</table>

Answer 4

方法1，传递jQuery对象：

sortTable($('#myTable'));

function sortTable(table) {
    var rows = table.find('> tbody > tr');
}

方法二，传递选择器字符串：

sortTable('#myTable');

function sortTable(tableSelector) {
    var rows = $(tableSelector).find('> tbody > tr');
}

编辑：（假设您只希望tbody中的行而不是head，否则删除“> tbody> tr”）

将元素添加到传递的jQuery选择器

4 个答案: