将每个字符串块附加到不同的URL地址

时间:2014-07-14 18:32:02

标签: javascript jquery html splice

请查看此fiddle

我使用splice将数组分成三个小数组。任何人都可以告诉我如何将它们中的每一个附加到示例中的数据源属性中的url?我希望输出像这样:

<div class="site" data-source="http://url.com/?query=A|B"></div>
<div class="site" data-source="http://url.com/?query=C|D"></div>
<div class="site" data-source="http://url.com/?query=E|F"></div>

示例&n;的HTML:

<div data-term="A" class="selector"></div>
<div data-term="B" class="selector"></div>
<div data-term="C" class="selector"></div>
<div data-term="D" class="selector"></div>
<div data-term="E" class="selector"></div>
<div data-term="F" class="selector"></div>

<div class="site" data-source="http://url.com/?query="></div>
<div class="site" data-source="http://url.com/?query="></div>
<div class="site" data-source="http://url.com/?query="></div>

jQuery的:

    var terms = $('.selector').map( function() {
    return $( this ).data('term');
}),chunks;

while (terms.length > 0) {
    chunks = terms.splice(0,2);
    var see = chunks.join('|');
    console.log(see);   
    }

5 个答案:

答案 0 :(得分:2)

使用attr()

/*get terms per OP code */

$('.site').attr('data-source',function(i, prev){
   return prev+terms.splice(0,2).join('|');       
});

DEMO

答案 1 :(得分:0)

您可以使用$(selector).attr功能来检索和/或修改HTML属性

这样的事情应该有效:

$('.site').attr('data-source', $('.site').attr('data-source') + see);

如果您为每个元素添加一个ID,您可以选择使用它。

答案 2 :(得分:0)

这似乎工作正常:

var terms = $('.selector').map( function() {
    return $( this ).data('term');
}),chunks;

var counter = 0;
while (terms.length > 0) {
    chunks = terms.splice(0,2);
    var see = chunks.join('|');

    var siteDiv = $('.site:eq(' + counter + ')');
    var dataSourceText = siteDiv.attr('data-source');
    siteDiv.attr('data-source', dataSourceText + see);
    counter++;

    console.log('Old: ' + dataSourceText);
    console.log('New: ' + siteDiv.attr('data-source'));   
}

小提琴:http://jsfiddle.net/w4rwH/

答案 3 :(得分:0)

你可以试试这个:

var index = 0;
while (terms.length > 0) {
    chunks = terms.splice(0,2);
    var see = chunks.join('|');
    $('.site').eq(index).attr('data-source',function(i,v){
       return v + see; 
    });
    index++;
    }

JSFiddle Demo

答案 4 :(得分:0)

 var terms = $('.selector').map( function() {
      return $( this ).data('term');
      }),chunks;

 var i = 0;

 while (terms.length > 0) {    
 chunks = terms.splice(0,2);
 var see = chunks.join('|');
 console.log(see);  
 var el = $($('.site')[i]);

 //changes attribute
 el.attr('data-source', el.data().source + see);

 //dont touch html attribute just changing data() value 
 el.data().source = el.data().source + see;
 i++;
}

此处已更新Fiddle