如何使用jQuery將html文檔引用到div中的另一個html文檔？

這是我的html：如何使用jQuery將html文檔引用到div中的另一個html文檔？

<!DOCTYPE html> 

<html> 
    <head> 
     <title>Free Jokes!</title> 
     <meta charset="utf-8"> 
     <link href="final%20project.css" rel="stylesheet"> 
     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
    </head> 

    <body> 


     <div id="left"></div> 
     <script type="text/javascript"> 
     $(document).ready(function() { 
     $('#left').load("left.html"); 
     }); 
     </script> 

     <div id="right"></div> 
     <script type="text/javascript"> 
     $(document).ready(function() { 
     $('#right').load("right.html"); 
     }); 
     </script> 
    </body> 
</html>

的HTML是開放罰款，但我的左邊和右邊的HTML文檔沒有顯示出來。這可能是因爲沒有正確輸入代碼。有什麼我做錯了嗎？

有沒有什麼辦法可以引用我的左，右html文檔而不使用iframe？

來源

2013-07-26 user2617514

加載函數嘗試對指定的位置進行ajax調用（請記住，在JavaScript中，我們位於客戶端上），因此除非指定絕對URL，否則它不會從正確的位置檢索。此外，假設left.html和right.html是完整的文檔，包括doctype和<head>等，這將產生無效的HTML。

嘗試以下操作：

<html> 
    <head> 
     <title>Free Jokes!</title> 
     <meta charset="utf-8"> 
     <link href="final%20project.css" rel="stylesheet"> 
     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
    </head> 

    <body> 

     <iframe id="left" frameborder="0" style="border: 0;" src="left.html"></iframe> 
     <iframe id="right" frameborder="0" style="border: 0;" src="right.html"></iframe> 

    </body> 
</html>

雖然它並不完美，但至少應該正確顯示網頁。

來源

2013-07-26 22:35:12 UweB

相對URL在JS中絕對可以使用。我真的不會推薦使用iframe來做這件事。我們存在於_after_ 2003 – Bojangles

這是否意味着如果html不在web上，那麼您不能使用jQuery來做這件事？ – user2617514

是的，相對URL確實很好 - 我不確定我在那裏想什麼。雖然我強烈反對iframes。一般來說，它們當然不是一個好的解決方案 - 但是等待document.ready開始加載子頁面內容的理由更少。使用它們仍然有很好的理由 - 不管它是哪一年。 – UweB

如何使用jQuery將html文檔引用到div中的另一個html文檔？

回答

相關問題