Javascript 如何使用jQuery将字符串中的每个元素分隔开

我对外部站点进行了Ajax调用，从特定元素获取一些信息，并将其作为字符串返回到我的站点

以下是AJAX调用的代码：

$.ajax({
   url: 'http://cors.io/?u=http://www.spotlight.com/6298-9058-7917',
   type: 'GET',
   success: function(res) {
      var data = $.parseHTML(res);           

       $(data).find('.credit').each(function(){
          $('#credits').append($(this).html());
     });

   }
 });

这是外部站点上名为

.credit

的div的所有内容，返回的结果如下：

<div id="credits">
    <span class="creditYear">2010</span>, <span class="creditProductionType">Television</span>, <span class="creditCharacterRole">Cop Nicola Lanza</span>, <span class="creditProductionName">“Un posto al sole”</span>, <span class="creditCompany">Grundy</span>, <span class="creditDirector">Various</span><span class="creditYear">2008</span>, <span class="creditProductionType">Television</span>, <span class="creditCharacterRole">Lawyer Moroni</span>, <span class="creditProductionName">“Il Bene e il Male”</span>, <span class="creditCompany">Italy</span>, <span class="creditDirector">Giorgio Serafini</span>
</div>

<table>
    <tr>
        <td class="year"></td>
        <td class="production_type"></td>
        <td class="character_role"></td>
        <td class="production_name"></td>
        <td class="company"></td>
        <td class="director"></td>
        <td class="director"></td>
    </tr>
</table>

2010年，电视台，警察尼古拉·兰扎，“联合国独立报”，格兰迪，2008年，电视台，莫罗尼律师，“男性”，意大利，乔治·塞拉菲尼

显然，在我的页面上，这看起来有点混乱，我希望能做的是把它很好地放在一张桌子上。因此，对于每一组结果（即年份、产量、角色、生产名称、公司、主管），表中应该有一行，如下所示：

<div id="credits">
    <span class="creditYear">2010</span>, <span class="creditProductionType">Television</span>, <span class="creditCharacterRole">Cop Nicola Lanza</span>, <span class="creditProductionName">“Un posto al sole”</span>, <span class="creditCompany">Grundy</span>, <span class="creditDirector">Various</span><span class="creditYear">2008</span>, <span class="creditProductionType">Television</span>, <span class="creditCharacterRole">Lawyer Moroni</span>, <span class="creditProductionName">“Il Bene e il Male”</span>, <span class="creditCompany">Italy</span>, <span class="creditDirector">Giorgio Serafini</span>
</div>

<table>
    <tr>
        <td class="year"></td>
        <td class="production_type"></td>
        <td class="character_role"></td>
        <td class="production_name"></td>
        <td class="company"></td>
        <td class="director"></td>
        <td class="director"></td>
    </tr>
</table>

---

…但每组结果对应一行。是否可以附加每个相应的积分（来自AJAX调用）并将其显示在我的表中？

您可以通过将每个跨距中的数据复制到表的相关单元格来实现：

在您的成功回调中：

// Set up the table however you want it to be formatted
var $tableTemplate = $('<table><tr>' +
  '<td class="year"></td>' +
  '<td class="production_type"></td>' +
  '<td class="character_role"></td>' +
  '<td class="production_name"></td>' +
  '<td class="company"></td>' +
  '<td class="director"></td>' +
  '</tr></table>');

$(data).find('.credit').each(function(){
  // Copy the data from the request to a copy of the table
  var $newTable = $tableTemplate.clone();
  var $creditData = $(this);
  $newTable.find('.year').text($creditData.find('.creditYear').text());
  $newTable.find('.production_type').text($creditData.find('.creditProductionType').text());
  $newTable.find('.character_role').text($creditData.find('.creditCharacterRole').text());
  $newTable.find('.production_name').text($creditData.find('.creditProductionName').text());
  $newTable.find('.company').text($creditData.find('.creditCompany').text());
  $newTable.find('.director').text($creditData.find('.creditDirector').text());

  // And append it to your div (or whatever you want to put it in)
  $('#credits').append($newTable);
}

//按照您希望的格式设置表格
变量$tableTemplate=$（“”+
'' +
'' +
'' +
'' +
'' +
'' +
'');
$（数据）。查找（'.credit'）。每个（函数（）{
//将数据从请求复制到表的副本
var$newTable=$tableTemplate.clone（）；
var$creditData=$（此项）；
$newTable.find（'.year'）.text（$creditData.find（'.creditYear'）.text（））；
$newTable.find（'.production_type'）.text（$creditData.find（'.creditProductionType'）.text（））；
$newTable.find（'.character_role'）.text（$creditData.find（'.creditCharacterRole'）.text（））；
$newTable.find（'.production_name'）.text（$creditData.find（'.creditProductionName'）.text（））；
$newTable.find（'.company'）.text（$creditData.find（'.creditCompany'）.text（））；
$newTable.find（'.director'）.text（$creditData.find（'.creditDirector'）.text（））；
//并将其附加到您的div（或任何您想放入的内容）
$（'#credits'）。追加（$newTable）；
}

---

演示：

像

一样接收它，

分开的

html

？难道输出的html不应该将所有内容都放在一个

中，然后每年重复一次吗？@4castle是的，在我的question@GuruprasadRao是的，这正是我想到的逗号分隔的htmlwhat是什么这个？@SamSkirrow中的$siteData变量在JSFIDLE演示中意外地保留了它，我已经更改了它now@SamSkirrow谁知道呢P@SamSkirrow仅供参考，我刚刚意识到出于性能原因，我不应该每次都在jQuery对象中重新包装

这个

，所以我稍微更改了代码以存储

$（这个）

输入一个变量，并使用该变量。