如何获取jQuery Datatable单元格内锚点（a）标签的文本值

问题原因 #

你代码中获取空值的核心问题是.contents()和.find('a')的搭配逻辑错误：

• .html(rVal).contents()返回的是虚拟div下的直接子节点集合，你要提取的<a>标签本身就属于这个集合的元素
• .find()方法的作用是查找当前元素的后代节点，不会匹配当前集合本身的元素，因此找不到目标a标签，最终返回空文本。

正确实现方案 #

你可以任选以下两种写法修正：

方案1：移除.contents()调用，直接在虚拟div节点上查找a标签 #

$(function() {
  var table = $('#sampleTable').DataTable();

  $('button').click(function() {
    var data = $('#sampleTable').dataTable().fnGetData();

    for (var i = 0; i < data.length; i++) {
      var rVal = data[i][0];
      // 直接在虚拟div内查找a标签取文本
      var anchorText = $('<div/>').html(rVal).find('a').text();
      alert(anchorText);
    }
  });
});

方案2：保留.contents()的写法，将.find()替换为.filter()匹配当前节点集合内的a标签 #

var el = $('<div/>').html(rVal).contents();
var anchorText = el.filter('a').text();
alert(anchorText);

优化说明 #

如果你的单元格内可能存在多个a标签，或者a标签外层有其他包裹元素，第一种方案的兼容性更强，不需要考虑标签层级。

内容的提问来源于stack exchange，提问作者hiFI