Question

关于下面的代码片段，我理解这一点，但我很少有像

这样的混淆

$(this).children().contents().wrap('<div>').parent().slideUp(function() {    
    $(this).closest('tr').remove();
});

1）children().contents()它做了什么。 2）wrap('<div>')什么是包装以及为什么需要div。 3）哪一个是父parent() tr父是表 4）closest()如何closest('tr')引用当前tr？

的功能是什么？

我只是不理解上面这一行

完整代码

<table border="1" width="600" cellspacing="0" cellpadding="0" id="test">
<tr>
    <td><b>First Name</b></td>
    <td><b>Last Name</b></td>
    <td><b>Address</b></td>
    <td><b>Town</b></td>

</tr>

<tr>
    <td>First Name</td>
    <td>Last Name</td>
    <td>Address</td>
    <td>Town</td>
</tr>
<tr>
    <td>First Name</td>
    <td>Last Name</td>
    <td>Address</td>
    <td>Town</td>
</tr>
<tr>
    <td>First Name</td>
    <td>Last Name</td>
    <td>Address</td>
    <td>Town</td>
</tr>

$('#test tr:not(:first)').click(function() {           
    $(this).css("background-color","red");  

    $(this).children().contents().wrap('<div>').parent().slideUp(function() {    
        $(this).closest('tr').remove();
    });
});

Answer 1

contents =＆gt; http://api.jquery.com/contents/

所以它将获得你的例子中的所有textNodes（Frist Name，姓氏等）

然后你用div包装那些textNodes，所以实际上是这样的：

名字等等，然后你用.parent()向上移动那个div然后你向上滑动，完成后你从你创建的div中删除最近的tr。

提示是使用firefox（使用firebug）或chrome或任何具有控制台的浏览器，它将帮助您在未来超快速且超级简单地调试此类代码。

Answer 2

children().contents()将返回点击的<td>的每个<tr>的内容。根据您的示例，所有tds都包含文字，因此将返回TextNode数组。
wrap('<div>')它会用标签包装每个文本。 <div>不是“必需的”，它是您用文字包装的内容。
parent()它引用<div>，因为<div>是包装后内容的父级。
closest()只返回被点击<tr>的最近的<tr>。

关于jquery代码片段帮助

完整代码

2 个答案: