Include html in another html file [duplicate]

by

Method 1:

I think it would be best way to include an html content/file into another html file using jQuery.

You can simply include the jQuery.js and load the HTML file using $("#DivContent").load("yourFile.html");

For example

<html> 
  <head> 
    <script src="https://stackoverflow.com/questions/38837835/jquery.js"></script> 
    <script> 
    $(function(){
      $("#DivContent").load("another_file.html"); 
    });
    </script> 
  </head> 

  <body> 
     <div id="DivContent"></div>
  </body> 
</html>

Method 2:

There are no such tags available to include the file but there are some third party methods available like this:

<!DOCTYPE html>
<html>
<script src="http://www.w3schools.com/lib/w3data.js"></script>

<body>

<div w3-include-html="content.html"></div> 

<script>
w3IncludeHTML();
</script>

</body>
</html>

Method 3:

Some people also used server-side-includes (SSI):

<!--#include virtual="a.html" -->

More Related Contents:

  1. Reloading a single div in an html page [closed]
  2. jQuery doesn’t give a proper output, but gives these [closed]
  3. fixing slider on my website [closed]
  4. Stop form refreshing page on submit
  5. contenteditable change events
  6. Avoid dropdown menu close on click inside
  7. How to properly use jsPDF library
  8. How to get the element clicked (for the whole document)?
  9. How to clear the contents of an iFrame from another iFrame
  10. Prevent form redirect OR refresh on submit?
  11. TypeError: p.easing[this.easing] is not a function
  12. Hide scrollbar while still being able to scroll with mouse/keyboard [duplicate]
  13. JavaScript – head, body or jQuery?
  14. jQuery: get data attribute
  15. Creating a select box with a search option
  16. Simulate drop file event
  17. Jquery Event Not Triggering for DOM Elements Created after page load [duplicate]
  18. How to handle in textarea?
  19. Why do multiple `.appendTo` calls on a newly created jQuery element only append it once?
  20. How to change only text node in element [duplicate]
  21. How to resize Twitter Bootstrap modal dynamically based on the content
  22. Prevent browser from loading a drag-and-dropped file
  23. How to bind click event to object tag?
  24. make readonly/disable tinymce textarea
  25. Chrome Extension “Refused to load the script because it violates the following Content Security Policy directive”
  26. iframe Auto Adjust Height as content changes
  27. How can I dynamically highlight strings on a web page?
  28. Changing cursor to waiting in javascript/jquery
  29. Returning value from confirmation dialog using JQuery UI dialog
  30. How can I calculate the difference between two times that are in 24 hour format?

Leave a Comment