jQuery ajax xml导入节点到文档中

时间:2014-05-20 14:41:06

标签: javascript jquery ajax xml

function getNewMonth(month, year, table) {
    "use strict";
    var uri, newTable;
    uri = 'ajax.php?m=' + month + '&y=' + year;
    $.ajax({
        type: 'GET',
        cache: false,
        url: uri,
        dataType: 'xml',
        success: function (xml) {
            newTable = document.importNode(xml.getElementsByTagName('table')[0], true);
            $(table).replaceWith(newTable);
        }
    });
}

我对ajax做的不多,但我理解服务器中的xml是与网页不同的文档的一部分。没有找到导入的jQuery方法,我使用了标准的JS importNode。

当此函数运行时,旧表将替换为new,但不会呈现。显示文本内容,但不显示在渲染表中。

Inspect元素显示所有标签都在那里,但我尝试的两个浏览器(FireFox和Midori)都不会渲染表格。

我做错了什么?

来自服务器的响应是使用标准html表和子节点的有效XML,并且由生成它所替换的呈现表的服务器上完全相同的php代码生成 - 只是一个不同的月份和年份。

显然,我在这里无法理解。

我感谢任何建议。

编辑 -

这是ajax响应的样子:

<?xml version="1.0" encoding="UTF-8"?>
<table style="float: left; width: 800px; background: url('PNG/RitaCalendar.png') no-repeat bottom;" cellspacing="0px" class="sexycal" data-year="2016" data-month="7" data-ete="Mistress Rita" data-uri="http://www.kinkonomics.com/">
  <caption><span title="Previous Month">◀</span>   July 2016   <span title="Next Month">▶</span></caption>
  <tr height="40px">
    <th scope="col" valign="top" width="14.28%">Sunday</th>
    <th scope="col" valign="top" width="14.28%">Monday</th>
    <th scope="col" valign="top" width="14.28%">Tuesday</th>
    <th scope="col" valign="top" width="14.28%">Humpday</th>
    <th scope="col" valign="top" width="14.28%">Thursday</th>
    <th scope="col" valign="top" width="14.28%">Friday</th>
    <th scope="col" valign="top" width="14.28%">Saturday</th>
  </tr>
  <tr height="133px">
    <td valign="top" align="right"> </td>
    <td valign="top" align="right"> </td>
    <td valign="top" align="right"> </td>
    <td valign="top" align="right"> </td>
    <td valign="top" align="right"> </td>
    <td class="data" valign="top" align="right">1</td>
    <td class="data" valign="top" align="right">2</td>
  </tr>
  <tr height="133px">
    <td class="data" valign="top" align="right">3<br/><span class="mname"><a href="http://www.kinkadvisor.com/" target="_blank">Marilyn</a></span><br/><span class="wlist"><a href="http://www.amazon.com/registry/wishlist/43T049UULTFM" target="_blank">Wishlist</a></span></td>
    <td class="data" valign="top" align="right">4</td>
    <td class="data" valign="top" align="right">5</td>
    <td class="data" valign="top" align="right">6</td>
    <td class="data" valign="top" align="right">7</td>
    <td class="data" valign="top" align="right">8</td>
    <td class="data" valign="top" align="right">9</td>
  </tr>
  <!-- more of the same -->
  <tr height="133px">
    <td class="data" valign="top" align="right">31<br/><span class="mname"><a href="http://www.fetishphonesexcalls.com/" target="_blank">EmmaJane</a></span><br/><span class="wlist"><a href="http://www.amazon.com/wishlist/2Y3GT6EEWXW20" target="_blank">Wishlist</a></span></td>
    <td valign="top" align="right"> </td>
    <td valign="top" align="right"> </td>
    <td valign="top" align="right"> </td>
    <td valign="top" align="right"> </td>
    <td valign="top" align="right"> </td>
    <td valign="top" align="right"> </td>
  </tr>
</table>

如果重要的话,那就是php

$xml = new DOMDocument("1.0", "UTF-8");
$xml->formatOutput = true;

$reqmonth = dateObject($y, $m);

$table = monthTable($db,$xml,$reqmonth);
$xml->appendChild($table);
header('Content-Type: application/xml');
//avoid caching
header("Cache-Control: no-cache, must-revalidate");
header("Expires: Sat, 26 Jul 1997 05:00:00 GMT"); // Date in past
print($xml->saveXML());
exit;

monthTable()与用于在最初提供的网页中生成表格的功能相同。

1 个答案:

答案 0 :(得分:0)

如果我这样做是文本而不是xml -

function getNewMonth(month, year, table) {
    "use strict";
    var uri, newTable;
    uri = 'ajax.php?m=' + month + '&y=' + year;
    $.ajax({
        type: 'GET',
        cache: false,
        url: uri,
        dataType: 'text',
        success: function (text) {
            $('#caldiv').prepend(text);
            $(table).remove();
            attachEvents();
        }
    });
}

因此,出于某种原因,importNode似乎允许将节点添加到DOM树,但它不会触发渲染刷新。但是上面的工作正是如此,我只会坚持下去。