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 来说是不可见和私有(private)的。其他任何东西都看不到它。

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

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

最后一步很简单，我们需要删除第一个 > 之后的所有内容。 ，所以我使用正则表达式 .replace(/>[\s\S]*/,'>') (我喜欢正则表达式)(你可以看出它是正则表达式，因为它位于斜杠 / ... / 中)

正则表达式为>[\s\S]* 。它将从头开始并向前移动，直到找到>。 ，然后它将寻找任何白色 s步伐或非白人S步伐人物。 ( [\s\S] )，它将查找任意数量的 * 。然后它将替换 >[\s\S]*与 > .

现在您已将最终结果存储到变量 html 中。 :)

(仅供引用，使用 jQuery 创建新的 HTML 片段(如 $('<tbody>') )时，仅当没有子项或属性时，您才可以安全地省略结束标记。请参阅 jQuery: Risk of not closing tags in constructors )