使用jQuery元素属性追加到匹配元素

我有一些文章类的元素。这些元素具有paper-id属性。我希望他们移动到相应的div中，该div应该具有类面板paper-id，其中paper-id与相应元素中的paper-id属性相同。使用jQuery元素属性追加到匹配元素

我离开这里使用jQuery(this)（这显然是行不通的）的一个例子，是想说明什么，我需要

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

来源

2013-10-23 sauronnikko

你想介绍一下你的'HTML'的样本吗？ –

请记住'data-paperid'是'paper-id'不是一个有效的属性。 –

为自定义属性使用'data-'前缀。 –

不要使用发明的属性。对于自定义属性，始终使用data-*属性。

HTML例如：

<div class="article" data-paperid="2"> I'm paper 2 </div>

的jQuery：

jQuery(function($) { 

    $('.article').each(function() { 
     var myDataId = $(this).data('paperid'); 
     $(this).appendTo('.panel'+ myDataId); 
    }); 

});

_{Data attribute reference + guide}

来源

2013-10-23 23:25:18

小提琴：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>

来源

2013-10-23 23:31:33 colbydauph

你可以试试这个

$(function(){ 
    $('.article').each(function(k, v){ 
     $(".panel-" + $(v).data('paper-id')).append($(v)); 
    }); 
});

An Example.

来源

2013-10-23 23:37:40

使用jQuery元素属性追加到匹配元素

回答

相关问题