jquery如何从一个位置删除一个元素到另一个位置并重复x次

发布于 2024-09-28 12:08:28 字数 900 浏览 2 评论 0原文

我正在尝试删除 h4 下面的第一个链接图像并将其添加到 div.image-thumb 前面。如果我使用的代码只是一个表行 ".tr-class" ，那么它就可以工作。

但是当我有多行时，它将所有链接图像复制到 .image-thumb 中。因此，如果我有 10 行，那么每行将有 10 个链接图像。我怎样才能在正确的位置获得正确的链接图像 HTML 和 JS 如下：

谢谢

<table>
<tr class="tr-class">
<td class="left-td">
    <div class="image-thumb">
    </div>
</td>
<td class="right-td">
    <h4>Header</h4>
    <a href="http://www.google.com"><img src="image.png" /></a>
    <p>this is my content</p>
    <a href="http://www.google.com">Read more</a>                
</td>       
</tr>

for(i = 0; i < 10; i++){
    $(".tr-class").eq(i).each(function(){
        var getImage = $(".tr-class .right-td h4").next().eq(i);
        $(getImage).prependTo(".tr-class .image-thumb");
    });
}

原文

I'm trying to remove the first link-image below the h4 and prepend it to div.image-thumb. The code i use work's fine if it's just one table row ".tr-class" .

But when I have multiple rows, it copies all the link-image into .image-thumb. So if I have 10 rows, then each row will have 10 link-image each. How can I can get just the right link-image in the right spot The HTML and JS are below:

Thanks

<table>
<tr class="tr-class">
<td class="left-td">
    <div class="image-thumb">
    </div>
</td>
<td class="right-td">
    <h4>Header</h4>
    <a href="http://www.google.com"><img src="image.png" /></a>
    <p>this is my content</p>
    <a href="http://www.google.com">Read more</a>                
</td>       
</tr>

for(i = 0; i < 10; i++){
    $(".tr-class").eq(i).each(function(){
        var getImage = $(".tr-class .right-td h4").next().eq(i);
        $(getImage).prependTo(".tr-class .image-thumb");
    });
}

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

情仇皆在手 2024-10-05 12:08:28

试试这个：

$('.tr-class')
  .each(
    function()
    {
      $('.right-td h4 + a', this).appendTo($('.image-thumb', this));
    }
  );

Try this:

$('.tr-class')
  .each(
    function()
    {
      $('.right-td h4 + a', this).appendTo($('.image-thumb', this));
    }
  );

回复收藏 0 原文

删除→记忆 2024-10-05 12:08:28

我不确定它的效率如何，但这似乎有效：

$(document).ready(
    function(){
        $('img').each(
            function(i){
                $(this).prependTo($('.image-thumb').eq(i));
            }
        );
    }
);

JS Bin 的演示

所做的假设：

每个 .tr-class 只会有一个图像，如果您为图像分配一个类，可能会更可靠。

I'm not sure how efficient it is, but this seems to work:

$(document).ready(
    function(){
        $('img').each(
            function(i){
                $(this).prependTo($('.image-thumb').eq(i));
            }
        );
    }
);

Demo at JS Bin