Question

我有一个类似的网页：

<html>
<head>
   . . .
</head>
<body>
  <div id="wrapper">
    <p>Lots of content here!</p>
  </div>
</body>
</html>

我还有一个这样的外部文件：

<div id="more-stuff"><p>Even more content!</p></div>

我想要的是拥有这样的网页：

<html>
<head>
   . . .
</head>
<body>
  <div id="wrapper">
    <p>Lots of content here!</p>
    <div id="more-stuff"><p>Even more content!</p></div>
  </div>
</body>
</html>

使用jQuery。我的猜测是这样的：

$(document).ready(function(){
  $('#wrapper').append.load('/external.htm');
});

但它不起作用，我似乎无法找到一个好的解决方案。

Answer 1

尝试这样的事情：

$(document).ready(function(){
    $.get('/external.htm', function(data) {
        $('#wrapper').append(data);
    });
});

它告诉jQuery请求html文件，然后在准备就绪时运行回调（反过来追加请求返回的数据）。

Answer 2

.append()不起作用。它需要附加文本。但.load()会覆盖其目标的内容，因此您需要先添加一个子项，然后加载到该子项。

$(document).ready(function(){
    $('#wrapper').append($(document.createElement("p")).load('extern.html'));
});

.append使用jQuery进行.load -ed

2 个答案: