PHP样式以HTML格式插入文件内容

Ban*_*anK 1 html javascript php

我有一个目录,这是我生成的许多html文件的共同点.我希望所有这些都引用一个公共表,这样如果我更改表,所有文件都会反映它,并且不需要触摸它们.

是否存在类似这样的PHP代码的客户端等价物?

<?php readfile("file.html"); ?>
Run Code Online (Sandbox Code Playgroud)

我从来没有使用PHP,但我想避免安装服务器端程序来在本地查看HTML文件.

谢谢.

ble*_*lex 5

您可以使用JavaScript动态加载HTML内容.

这是一个例子:

table_of_contents.html

<ul>
    <li>Section I<li>
    <li>Section II<li>
    <li>Section III<li>
</ul>
Run Code Online (Sandbox Code Playgroud)

您想要包含其中的目录的其他页面

<!DOCTYPE html>
<html>
<head>
    <title>Some page</title>
</head>
<body>
    <div id="table-of-contents"></div>

    <p>Some content on your page</p>

    <script>
    document.addEventListener('DOMContentLoaded', function () {
        // Create a XMLHttpRequest
        var xhr = new XMLHttpRequest();
        // When it loads, insert the HTML into the container
        xhr.onload = function () {
            document.getElementById('table-of-contents').innerHTML = this.response;
        };

        // Set the request parameters
        xhr.open('GET', 'table_of_contents.html', true);
        // Send the request
        xhr.send();
    }, false);
    </script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

或者,如果你正在使用jQuery,你可以做一个单行.load():

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script>
$(function () {
    $('#table-of-contents').load('table_of_contents.html');
});
</script>
Run Code Online (Sandbox Code Playgroud)

请注意,此方法可能仅适用于服务器(使用http://,不使用file:\\\),因为浏览器为了每个人的安全而实施的同源策略 - 您不希望某个随机网站从您的系统加载文件.