简体中文（ZH-CN）English（EN）繁体中文（ZH-TW）日本語（JA）한국어（KO）Melayu（MS）Français（FR）Deutsch（DE）
首页
文章
问答
课程
专题
下载
手游
词典
最近更新

首页  >  问答  >  正文

javascript - 遍历修改<td>标签

jquery版本:1.8
原代码

<tr>
<td>1</td>
<td>11,12</td>
</tr>
<tr>
<td>2</td>
<td>21,22</td>
</tr>

改成

<tr>
<td>1</td>
<td><a>11</a><a>12</a></td>
</tr>
<tr>
<td>2</td>
<td><a>21</a><a>22</a></td>
</tr>

尝试过给<td>11,12</td>加入id="img",但是$("#img").eq(1).html()无法获取到第二行的内容.

for(var i=0; $("#img").length; i++){
   //$("#img").eq(i).html需要非空判断
    var arr= $("#img").eq(i).html.spilt();
    var str;
    for(var j=0; aar.length; j++){
        str = "<a>"+arr[j]+"</a>";
    }
    $("#img").eq(i).html(str);
}

jQuery不是很熟,一些语法错误希望大手帮忙改正,给大手们添麻烦了.

仅有的幸福仅有的幸福2663 天前870

全部回复(3)我来回复

  • 阿神

    阿神2017-07-05 10:59:16

    不知道你明不明确一点，id是唯一的，一个html代码页面同样的id名称只能有一个！所以$("#img").eq(1)这样的代码肯定不符合规范。

    目测你的代码把添加id改为添加类class后这样是没有问题的，另外可以使用jquery的each方法来遍历dom节点：

    var $img = $('.img');'
$img.each(function(index,item){
    var aar = $(item).text().split(','),
       str = '';
    arr.forEach(function(item1,index1){
        str = "<a>"+item1+"</a>";
    });
   $(item).html(str);
});

    回复
    0
  • 滿天的星座

    滿天的星座2017-07-05 10:59:16

    雷雷

    回复
    0
  • 怪我咯

    怪我咯2017-07-05 10:59:16

    id只能是唯一的哦，只能取到第一个值，所以要用class

    <!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>test</title>
    <script type="text/javascript" src="https://cdn.bootcss.com/jquery/2.2.3/jquery.min.js"></script>
<body>
  <table>
    <tr>
      <td>1</td>
      <td>11,12</td>
    </tr>
    <tr>
      <td>2</td>
      <td>21,22</td>
    </tr>
   </table>
</body>
<script type="text/javascript">
$(function () {
  $('tr').each(function(){
    $(this).addClass("img");    // 这里加入class
    var dom = $(this).find("td").eq(1);
    dom.each(function () {
    var arr = $(this).html().split(",");
    var len = arr.length;
    var str = '';
    for (let i = 0; i < len; i++) {
        str += '<a>' + arr[i] + "</a>"
    }
    console.log($(this), len, str);
    $(this).html(str);
  });
});

  // 这里你可以输出来看看
  console.log($(".img").eq(1).html())
})
</script>
</html>

    回复
    0
  • 取消回复