加载后无法获取html内容

Cannot get html content after a load

本文关键字:html 内容 获取 加载      更新时间:2023-09-26

我正试图用以下代码替换已加载元素的上下文:

$("#menu1").load("./templates/menu.html");
var str = $("#menu1").html();
alert(str);
str.replace("[number]", "1");
$("#menu1").replaceWith(str);

但我总是得到一个空的strmenu1会正确加载menu.html内容,所以我不知道发生了什么。

您需要在加载后测试字符串-按照您的方式,它可以在加载时运行。试试这个:

$("#menu1").load("./templates/menu.html", function() {
    var str = $("#menu1").html();
    alert(str);
    str.replace("[number]", "1");
    $("#menu1").replaceWith(str);
});

更多信息

$("#menu1").load("./templates/menu.html", function(){
   //complete
   var str = $("#menu1").html();
});

加载部件不是即时的,所以您试图在load()有时间完成之前应用var str = $("#menu1").html();

您需要在load:-的回调函数中完成任务

例如:-)

<!DOCTYPE html>
<html>
  <head>
    <script data-require="jquery@*" data-semver="2.1.3" src="http://code.jquery.com/jquery-2.1.3.min.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>
  <body>
    Hello this is rachit 1 1 1 1.
    <div id="menu1"></div>
    <script>
      $("#menu1").load("index.html", function() {
    var str = $("#menu1").html();
    alert(str);
    str.replace("[number]", "1");
    $("#menu1").replaceWith(str);
});
    </script>
  </body>
</html>

Plunker