jquery - 使用 jQuery 元素属性附加到匹配元素

Question

我有一些带有文章类的元素。这些元素有一个 paper-id 属性。我希望它们移动到相应的 div 中，该 div 应该具有类 panel-paper-id，其中 paper-id 与 paper-id 相应元素的属性。

我在这里留下一个使用 jQuery(this) 的示例(这显然不起作用)，只是为了展示我需要什么

jQuery('.article').appendTo(".panel-" + jQuery(this).attr('paper-id'));

Answer 1

fiddle : http://jsfiddle.net/6B9xk/3/

HTML

<div class='article' paper-id='1'>paper 1</div>
<div class='article' paper-id='2'>paper 2</div>
<div class='article' paper-id='3'>paper 3</div>
<div class='article' paper-id='3'>paper 3</div>
<div class='article' paper-id='4'>paper 4</div>

<div class='panel' panel-paper-id='1'></div>
<div class='panel' panel-paper-id='2'></div>
<div class='panel' panel-paper-id='3'></div>
<div class='panel' panel-paper-id='4'></div>

JavaScript

$('.article').each(function(i, el){
    $("div[panel-paper-id='"+ $(el).attr('paper-id') +"']").append($(this));
});

输出

<div class='panel' panel-paper-id='1'>
    <div class='article' paper-id='1'>paper 1</div>
</div>
<div class='panel' panel-paper-id='2'>
    <div class='article' paper-id='2'>paper 2</div>
</div>
<div class='panel' panel-paper-id='3'>
    <div class='article' paper-id='3'>paper 3</div>
    <div class='article' paper-id='3'>paper 3</div>
</div>
<div class='panel' panel-paper-id='4'>
    <div class='article' paper-id='4'>paper 4</div>
</div>