jquery - 向后工作

Question

我可以使用以下代码设置表格元素的焦点：

document.getElementById($('#' + ListBoxVal + ' tr:eq('+lstRow+')')
        .attr('id')).focus();

我能够验证 tr 的 id 实际上是正确的 id：

console.log($('#' + ListBoxVal + ' tr:eq('+lstRow+')').attr('id'));

我需要做的是获取我所在 id 的 tr 的实际 HTML..

基本上使用此代码的一些变体，我需要 tr 元素的 html：

console.log($('#' + ListBoxVal + ' tr:eq('+lstRow+')').attr('id')); 

但我只需要开头的<tr> html。我不需要<td> 或结束</tr>。

<table>
  <tr id='123'>
    <td>1</td>
    <td>2</td>
    <td>3</td>
  </tr>
  <tr id='abc'>
    <td>a</td>
    <td>b</td>
    <td>c</td>
  </tr>
</table>

所以我只想要<tr id='123'>。

Answer 1

var tr = $('#' + ListBoxVal + ' tr:eq('+lstRow+')')
var html = $('<tbody>').append(tr.clone()).html().replace(/>[\s\S]*/,'>')
console.log(html)

详情

您不能直接获取元素的 HTML，只能获取 DOM innerHTML。 （与 jQuery html() 相同）

首先我们创建一个新的空$('<tbody>')。这在文档中不存在，因此对我们的 JavaScript 来说是不可见的和私有的。没有其他人可以看到它。

然后我们使用.append(tr.clone()) 添加该tr 的副本。 （我们必须先复制它，否则我们将在append期间将其从原始位置删除）

然后我们得到带有.html() 的tbody 的innerHTML。我们现在有了 TR 的“外部 HTML”（<tr...>...</tr>）

最后一步很简单，我们需要去掉第一个>之后的所有内容，所以我使用正则表达式.replace(/>[\s\S]*/,'>')（我喜欢正则表达式）（你可以说它是一个正则表达式，因为它是斜线/ .../)

正则表达式是>[\s\S]*。它将从头开始并向前移动，直到找到>，然后它将查找任何白色space 或非白色Space 字符。 ([\s\S])，它将查找任意数量的*。然后它将>[\s\S]*替换为>。

现在您将最终产品存储到变量html。 :)

（仅供参考，当使用 jQuery 创建新的 HTML sn-ps（如 $('<tbody>')）时，只有在没有子项或属性时，您才能安全地省略结束标记。参见 jQuery: Risk of not closing tags in constructors）

Answer 2

使用 document.getElementById，并将 ID 传递给 jQuery 是一个多余的操作 - 这是 jQuery 的首要任务之一！如果您知道<tr> 元素的ID，您可以直接获取它并使用jQuery 获取html：

$('#123').html()

因为 ID 是（或应该是）唯一的，您可以安全地使用它们来引用任何元素 - 您通常不需要担心从包含元素之一开始。

我想我不明白您想要正确实现的目标 - 抱歉！