Javascript 使用本地外部文件中的HTML_Javascript_Jquery_Html

Javascript 使用本地外部文件中的HTML

javascript jquery html

Javascript 使用本地外部文件中的HTML,javascript,jquery,html,Javascript,Jquery,Html,我基本上希望将一个HTML文件作为网站嵌入到一个div元素中，以保存内容。这里是我的非常简单的HTML开始。我想将在本地存储上的外部文件中找到的内容放入： <html> <head> <title>My HTML5 App</title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-wi

我基本上希望将一个HTML文件作为网站嵌入到一个

div

元素中，以保存内容。这里是我的非常简单的HTML开始。我想将在本地存储上的外部文件中找到的内容放入

：

<html>
    <head>
        <title>My HTML5 App</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="shortcut icon" href="favicon.ico">
        <link rel="stylesheet" href="css/ionicons.css">
        <link rel="stylesheet" href="css/bootstrap.min.css">
        <link rel="stylesheet" href="css/CustomStyling.css">

        <script src="js/jquery-2.1.4.min.js"></script>
        <script src="js/bootstrap.min.js"></script>
        <script src="js/content-controller.js"></script>
    </head>
    <body>
        <div class="body-header">
            <ul class="nav nav-pills nav-justified">
                <li role="presentation" class="active" id="homeBtn">
                    <a href="#"><b>Home </b><i class="ionicons ion-ios-home"
                                               style="
                                               font-size: 22px;
                                               vertical-align: middle;"></i>
                    </a>                    
                </li>
                <li role="presentation" id="feriefribookingBtn">
                    <a href="#"><b>Ferie Fri Booking </b><i class="glyphicon glyphicon-plane"
                                               style="
                                               font-size: 20px;
                                               vertical-align: middle;"></i>
                    </a>
                </li>
                <li role="presentation" id="pinfinityBtn">
                    <a href="#"><b>P - </b><i class="ionicons ion-ios-infinite" 
                                      style="
                                      font-size: 22px; 
                                      vertical-align: middle;"></i>
                    </a>
                </li>
                <li role="presentation" id="manpowerBtn">
                    <a href="#"><b>Manpower </b><i class="ionicons ion-ios-people"
                                               style="
                                               font-size: 24px;
                                               vertical-align: middle;"></i>
                    </a>
                </li>
            </ul>
        </div>
        <div class="body-content">
            <div class="jumbotro" style="text-align: center;"><h1>Home</h1></div>
        </div>
        <div class="body-footer"></div>
    </body>
</html>


我的HTML5应用程序










家

因此，它基本上是一个web应用程序或类似程序，作为独立元素嵌入到我的网站中，就像我作为自己的网站访问HTML一样运行。这是我第一次尝试一个单页网站，所以如果我问一些疯狂的问题，请容忍我：）

我现在不知道怎么做。请帮忙？：）

您可以使用jQuery

jQuery.load

函数：

$("#body-content").load("link_to_your_file.html");

有关详细信息，请参阅文档。

请查看。好的，谢谢！我来看看：）