jQuery .load() - 从 DOM 获取 td 内容

Question

我正在从一页读取表格行，然后尝试将单元格内容放入第二页的各种元素中。我有它的工作，但我想（a）正确地做，并且（b）摆脱我捡起的额外标签。 所以我的方法是……

$(document).ready(function() {
  $(function(){
    $('#result_row').load('schedule.html #schedule_list tr:eq(1)',function(){
        var date = $('td:eq(0)',this);
        $('#date').html(date);
        var title = $('td:eq(0)',this);
        $('#title').html(title);
        var speaker = $('td:eq(0)',this);
        $('#speaker').html(speaker);
    });             
  }); 
});

然后我有 <div class= "upcoming"> Next Talk: <span id="speaker"></span> - <span id="title"></span> (<span id="date"></span>) </div> <span id="result_row"></span>

所以这在一定程度上是可行的，但我有一种明显的感觉，因为我是 jQuery 新手，我这样做效率低下（或错误）。特别是，有一个空的<span id="result_row"> 似乎不正确。更重要的是，它还将<td> 标签导入<span> 元素，我想避免这种情况。所有对 innerHTML 的尝试都失败了（例如 var date = $('td:eq(0)',this).innerHTML;

感谢您的帮助，

尼克

编辑：所以现在我可以这样做三遍

var date = $('td:eq(0)',this).text();
$('#date').text(date);

避免获得<td> 标签。或者我可以这样做

var data = $.find('td',this);
$('#date').html(data[0]);
$('#speaker').html(data[1]);
$('#title').html(data[2]);

我认为这看起来更清晰（我假设最后三行可以合二为一）。遗憾的是 .text() 似乎不起作用，所以我在输出中坚持使用 <td>。

Answer 1

如果您只想获取tds 中的数据，请使用.html() 或.text()。例如：

var date = $('td:eq(0)',this).html();

就正确执行而言，从页面加载 html（抓取）很少正确执行。您应该从其他来源获取数据，例如由服务器提供和格式化的 json 等。但是如果您必须这样做，您的代码对我来说看起来不错:)

Answer 2

在效率方面，我会这样做：

$(document).ready(function() {
    var resultRow = $('#resultRow');

    $.ajax({
        url: 'schedule.html'
    })
    .done(function(response) {
        var context = $('#schedule_list tr:eq(1)'),
            data = context.find('td:eq(0)');

        $('#date, #title, #speaker').html(data).appendTo(resultRow);
    });
});

我注意到你有 2 个document.readys。删除了其中一个。