Question

我正在尝试构建一个非常简单的网页（一个页面，分为两个部分，每个部分都有它自己的html文件）：

Welcome.html & Welcome.css：

<html>

    <head>
        <link rel="stylesheet" type="text/css" href="Welcome.css">
    </head>

    <body id="bodyTag">

     <script type = "text/javascript"  src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>       
      <script type = "text/javascript">
         $(document).ready(function(){            

         });
      </script> 

       <div id="top" w3-include-html="/Top.html">

       </div>

       <div id="bottom">
            bottom
        </div>

    </body>
</html>


#bottom {    
    height: 50%;
    background-color: blue;
}

#top {    
    height: 50%;
    background-color: orange;
}

我希望Welcome.html文件将从外部html文件中获取最高内容

Top.html


<html>

  <head>    
  </head>

  <body>
      Test -> TOP

  </body>
</html>

但似乎Node.js日志中没有Top.html文件的请求：

var express = require('express');
var app = express();
var fs = require('fs');
var bodyParser = require('body-parser');

app.use(bodyParser.json())


/* 
 *  Home page
 */
app.get('/', function (req, res) {
   clearLogScreen();
   console.log("[/] Got request for '/'");
   res.sendFile( __dirname + '/Welcome.html');   
})


app.get('/Welcome.css', function(req, res) {
  console.log("[/Welcome] Got request for 'Welcome.css'");
  res.sendFile(__dirname + "/" + "Welcome.css");
});

app.get('/Top', function(req, res) {
  console.log("[/Top] Got request for 'Welcome.top'");
  res.sendFile(__dirname + "/" + "Top.html");
});


/* 
 *  Startup
 */
var server = app.listen(8081, function () {
   var host = server.address().address
   var port = server.address().port

   // start
   console.log("-----------------------------")  
   console.log("Dirname: " + __dirname);
   console.log("App listening at http://%s:%s", host, port)
})

我想我很容易错过一些东西，但却找不到错误。

Answer 1

请结账templatesjs;它将有助于在另一个html中插入html。

Answer 2

我不确定＆＃34; w3-include-html＆＃34;是，但如果它做它应该做的事情（根据名称），然后尝试从＆＃34; /Top.html＆#34;更改它的值; to＆＃34; / Top＆＃34;。或者，或者，尝试更改网址路径＆＃34; / Top＆＃34; to＆＃34; /Top.html"在你的快递应用程序中。

一方面注意：您收录的html（＆＃34; Top.html＆＃34;）不应该是完整的HTML。尝试删除html，header和body标签。它应该是一个片段。

拆分HTML文件不起作用

2 个答案: