javascript - jQuery .find() 返回“div”的值，但不返回“main”元素的值

Question

我有一段 html（在单独的页面 page2.php 上），如下所示：

<html><head>...</head><body>
    ...
    <main>
        <div>
            Hello
        </div>
    <main>
    ...
</body></html>

在 page1.php 上，我正在尝试使用$.get()请求来检索页面，然后用于获取元素find内的所有 HTML ：<main>

$.get("page2.php", function (data) {
    var myData = $(data).find('main');
    console.log($(myData).html());
});

当我尝试这个时，控制台显示“未定义”。

但是，当我更改find("main")为时find("div")，控制台将“Hello”显示为 String 类型。此外，find("header")、find("article")、find("footer")等都在控制台上显示字符串内容。

有什么独特之处<main>可以防止这种情况发生吗？它对 HTML 规范来说太新了吗？

即使尝试<main>通过 id 定义元素，la也会<main id="main">导致控制台显示“未定义”。

我正在寻找这个问题的具体答案；我不是在寻找另一种方法来做到这一点，例如load(). 提前致谢。

score 2 · Accepted Answer

使用filter()而不是find()用于根级元素。

$()去掉 html 和 body 标签，所以你main留在根级别

score 1 · Accepted Answer

main到目前为止，该元素仅在 Chrome (v 26+) 和 Firefox (v 21+) 中受支持。

如果您使用任何其他浏览器（或这些浏览器的旧版本）解析文档，浏览器将忽略该标签，或使其有所不同。解析的文档不会有任何main元素，因为那些浏览器不知道任何这样的元素。

Also, it seems that the main element has to be inside another element, for example:

<html><head></head>
<body>
  <div>
    <main>asdf</main>
  </div>
</body>
</html>

This will find the element, at least in Firefox 25 where I tested it:

var html = '<html><head></head><body><div><main>asdf</main></div></body></html>';
alert($(html).find('main').html());

score 0 · Accepted Answer

这是html5的一个新特性。其实<main>是一样的<div id="main">，所以你可以尝试使用find('#main')但不是find('main')

3 回答 3