Javascript jquery-获取表格单元格的html字符串

我有一些由服务器端代码生成的HTML。生成的HTML如下所示：

<table id="myChoices">
  <tr>
    <td><input type="radio" name="choice" value="1" /></td>
    <td>Monday</td>
    <td>Mar 7</td>
  </tr>

  <tr>
    <td><input type="radio" name="choice" value="2" /></td>
    <td>Tuesday</td>
    <td>Mar 8</td>
  </tr>

  <tr>
    <td><input type="radio" name="choice" value="3" /></td>
    <td>Wednesday</td>
    <td>Mar 9</td>
  </tr>

  <tr>
    <td><input type="radio" name="choice" value="4" /></td>
    <td>Thursday</td>
    <td>Mar 10</td>
  </tr>

  <tr>
    <td><input type="radio" name="choice" value="5" /></td>
    <td>Friday</td>
    <td>Mar 11</td>
  </tr>
</table>

我在控制台窗口中看到以下内容：

[object HTMLTableCellElement][object HTMLTableCellElement]

---

为什么?？如何获取实际的HTML字符串？

使用

outerHTML

，而是将jQuery对象存储在变量中

var cellHtml = cells[i];

应该是

var cellHtml = cells[i].outerHTML;

JS

function getHtml() {

  var item = $("#myChoices input[type='radio']:checked");
  if (item.length > 0) {
    var grandparent = item.closest('tr'),
          cells = grandparent.children();

    var html = '';
    for (var i = 1; i < cells.length; i++) {
        html += cells[i].outerHTML + ' ';
    }
  }

  return html;
}

  var html = '';

  var item = $("#myChoices input[type='radio']:checked");
  if (item.length > 0) {
    var grandparent = item.parent().parent();
    var cells = grandparent.children();

    var html = '';
    for (var i = 0; i < cells.length; i++) {
      if (i > 0) {
        var cellHtml = cells[i].outerHTML; //change here
        html += cellHtml;
      }
    }
  }

  console.log(html);

函数getHtml（）{ var item=$（“#myChoices输入[type='radio']：选中”）； 如果（item.length>0）{ var祖父母=最近的项目（'tr'）， 细胞=祖父母。子女（）； var html=''； 对于（变量i=1；i

改用这个

var cellHtml = cells[i].outerHTML;

完成JS

function getHtml() {

  var item = $("#myChoices input[type='radio']:checked");
  if (item.length > 0) {
    var grandparent = item.closest('tr'),
          cells = grandparent.children();

    var html = '';
    for (var i = 1; i < cells.length; i++) {
        html += cells[i].outerHTML + ' ';
    }
  }

  return html;
}

  var html = '';

  var item = $("#myChoices input[type='radio']:checked");
  if (item.length > 0) {
    var grandparent = item.parent().parent();
    var cells = grandparent.children();

    var html = '';
    for (var i = 0; i < cells.length; i++) {
      if (i > 0) {
        var cellHtml = cells[i].outerHTML; //change here
        html += cellHtml;
      }
    }
  }

  console.log(html);

var html=''；
var item=$（“#myChoices输入[type='radio']：选中”）；
如果（item.length>0）{
var祖父母=item.parent（）.parent（）；
var cells=祖父母。子女（）；
var html=''；
对于（变量i=0；i0）{
var cellHtml=cells[i].outerHTML；//在此处更改
html+=cellHtml；
}
}
}
log（html）；

结果格式：

---

MondayMar 7

我建议您稍微修改一下脚本，以简化整个过程

$("#myChoices input").change( function() {
     var string = $(this).parent().nextAll("td").text();
});

---

变量“string”将包含您要查找的文本。

您可以使用jquery的同级方法：

 var textContents = $("#myChoices input[type='radio']:checked").siblings().html();

---

我相信你可以用一些简单的方法，比如：

$（“输入[type='radio']：选中”）.parents（“tr”）.first（）.text（）

示例：
最简单的方法是在包含其他两个
td
元素的动态
tr
上使用
.html（）
方法

一个技巧是克隆它们，然后将它们包装在一个
tr
中，并获得该文件的html

var others = $(this).closest('td').siblings().clone();
alert( others.wrapAll('<tr>').parent().html());

var others=$（this）.clone（'td'）.sides（）.clone（）；
警报（others.wrapAll（“”）.parent（）.html（））；



$（函数（）{
$（'#myChoices[name=“choice”]'）。on（'change'，function（）{
var others=$（this）.clone（'td'）.sides（）.clone（）；
警报（others.wrapAll（“”）.parent（）.html（））；
});
});

星期一
3月7日
星期二
3月8日
星期三
3月9日
星期四
3月10日
星期五
3月11日
感谢您的回复。不幸的是，这种方法不包括实际的“.”。它只包括单元格中的文本。@user70192 Right。它包括实际文本。您还想查看HTML吗？是的。那是我的错。我没有正确地编码我的问题。我刚刚更新了它。我想看看3月9日星期三的
谢谢你的回复。不幸的是，这种方法不包括实际的“.”。它只包含单元格中的文本。这不是你想要的吗？如果你想用html<代码>var cellHtml=cells[i].outerHTML使用此。。您将于3月7日（星期一）收到
。我们都花了时间来创建回答原始问题的答案，然后当您更改问题的性质以获取html而不是文本时，它否定了我们几个人所使用的.text（）方法。不管每个帖子是正确的还是好的，问题的改变否定了它们，这意味着我们在问题上花费的时间是浪费的。