Question

我是JS的新手，这就是我在做什么。

当我这样做时，我有一个rawHtml字符串，它只是html

$(rawHtml).find('#footer')

我记录下来，这就是它返回的结果

jQuery {
'0': HTMLDivElement {},
'1': HTMLDivElement {},
'2': HTMLDivElement {},
'3': HTMLDivElement {},
'4': HTMLDivElement {},....}

所以我确定它不为空。但是如果我这样做

$(rawHtml).find('#footer').html()

它返回未定义。我只想打印出html，还有其他方法可以做到这一点吗？为什么打印未定义？

编辑

html很长，基本结构如下：

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
<title>Title</title>
<link rel="stylesheet" type="text/css" href="some link">
<link rel="stylesheet" type="text/css" href="some link">
<link rel="stylesheet" type="text/css" href="some link ">
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="css/animate.css">
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
</html>

为简单起见，页脚向下倾斜，并且更加复杂；如果我这样做，则从头开始是同一件事

$(rawHtml).find('head').html()

也返回未定义。

Answer 1

html返回undefined的唯一原因是，如果您在一个空的jQuery集合上调用它，那么这告诉我们find找不到任何东西。

find在jQuery集的条目的后代中查找。您的#footer似乎直接位于集合中（位于顶层）；当您使用$()解析HTML时，就会发生这种情况。如果是这样，则您希望使用filter而不是find。

示例：

var rawHTML =
  "<div id=header>header content</div>" +
  "<div id=footer>footer content</div>";
var footerText = $(rawHTML).filter("#footer").html();
console.log(footerText);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

或者，如果不确定该元素是顶层还是后代，则将整个内容包装在div中，然后使用find：

var rawHTML =
  "<div id=header>header content</div>" +
  "<div id=footer>footer content</div>";
var footerText = $("<div>").append(rawHTML).find("#footer").html();
console.log(footerText);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

jQuery find（）。html（）返回未定义

1 个答案: