使用 Google 闭包编译器时处理 jQuery parseHTML() 和 html(),,,答案

【问题标题】：Dealing with jQuery parseHTML() and html() when using Google closure compiler,,,使用 Google 闭包编译器时处理 jQuery parseHTML() 和 html(),,,
【发布时间】：2017-04-09 11:25:20
【问题描述】：

我有一组实际有效的简单语句（我已经运行了该代码，它完成了我对它的期望），如下所示：

result_xml = result.jqxhr.responseXML;
a = jQuery("data[name='calendar']", result_xml).text();
new_calendar = jQuery.parseHTML(a);
jQuery("div.calendar").html(jQuery("div.calendar table.calendar-table", new_calendar));

result 来自 AJAX 回复，您应该认出 jqxhr 字段。

我希望a 是一个字符串，因为我使用text() 获得了一个数据块。数据是我保存在 XML 文档中的 HTML 字符串。所以我可以这样投射：

a = /** @type {string} */ jQuery("data[name='calendar']", result_xml).text();

现在我将该字符串转换为 HTML DOM，认为它是一个元素：

new_calendar = /** @type {Element} */ jQuery.parseHTML(a);

这就是我得到这个奇怪错误的地方：

警告 - 无效转换 - 必须是子类型或超类型
来自：(Array.|null)
to : (元素|null)

所以parseHTML() 会返回一个元素数组（或 null）？

然后我试图在html() 函数中使用parseHTML() 的输出，我也很难理解发生了什么。

警告 - 无效转换 - 必须是子类型或超类型找到 : (Array.|null)
必需：（文档|元素|对象。|jQuery|null|未定义）

坦率地说，我不明白为什么 Google 编译器会使得一个函数的输出不能成为另一个函数的输入，即使它在现实世界中工作得很好。

Element 的数组是否会被视为Document？

最后（是的！所有这些都需要 3 行 JavaScript！）关于html() 函数的输入，我收到另一个错误：

警告 - jQuery.prototype.html 的实参 1 与形参不匹配发现：jQuery
必需：（函数（数字，字符串）：？|字符串|未定义）
jQuery("div.calendar").html(jQuery("div.calendar table.calendar-table", new_calendar));

在这里，它也适用于现实世界... jQuery 对象会自动转换为字符串，然后重新转换为要添加到我的日历中的一组标签吗？

这些都是闭包编译器的正常限制吗？

根据乍得的回答，我以这种方式更改了我的代码：

result_xml = result.jqxhr.responseXML;
a = /** @type {string} */ (jQuery("data[name='calendar']", result_xml).text());
new_calendar = jQuery.parseHTML(a);
jQuery("div.calendar").empty().append(jQuery("div.calendar table.calendar-table", new_calendar[0]));

我将text() 输出转换为闭包字符串；
我使用 new_calendar 的元素 0 而不是直接使用 new_calendar。
我将html() 更改为empty().append()，因为append() 函数接受jQuery 对象作为输入

这让闭包编译器很高兴。

【问题讨论】：

标签： javascript jquery casting google-closure-compiler

【解决方案1】：

是的，这绝对是预期的行为。 JavaScript 中有很多“工作”的东西。闭包编译器会在被询问时尝试强制执行良好的行为。

至于 jQuery - 这些是已发布的 jQuery API 的正常限制。使用 jQuery，代码通常支持未记录的行为（就像您列出的那样）。但是，jQuery 团队可以随时更改未记录在案的行为。

如果您不符合 API 规范中列出的内容，Closure-compiler 会发出警告（that definition 由社区维护 - 因此并不总是 100% 正确）。

以下是相关规格：

jQuery().html(string) - 要设置为每个匹配元素内容的 HTML 字符串
jQuery.parseHTML('string') - 返回：数组

【讨论】：

【解决方案2】：

我使用 DOM API 而不是 jQuery。数据中有完整的 HTML 文本。

// create DOM parser object
var dom_parser = new DOMParser();
// parse HTML into DOM document object
var doc = dom_parser.parseFromString(data , "text/html");
// doc.body.innerHTML = body part in text, not object
// <body> tag is stripped.
// append the body part into div with the id "contentsarea".
$("#contentsarea").empty().append(doc.body.innerHTML);

【讨论】：