динамически изменять текст в заголовке, который используется на нескольких html страницах javascript - PullRequest
0 голосов
/ 04 мая 2020

Я делаю простой веб-сайт с html, css, javascript без фреймворка или библиотеки. Я создал заголовок. html и включил его в несколько файлов html (например, index. html и около html), используя следующий код javascript. Однако я хочу, чтобы текст заголовка отличался в каждом файле html, какие методы я могу использовать для достижения этого с помощью простых html, css и javascript?

filePath = "../header.html";

fetch(filePath)
    .then(function (response) {
        return response.text();
    })
    .then(function (body) {
        // console.log(body);
        document.querySelector(".headerSection").innerHTML = body;
    });

Где заголовок. html показан ниже:

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>Document</title>
    </head>
    <body class="body">
        <header class="showcase">
            <div class="wrapper">
                <div class="showcase-top">
                    <p>About</p>
                    <img src="./img/logo.png" alt="logo" />
                    <p>Login</p>
                </div>
                <div class="showcase-bottom">
                    <p id="headerText">
                        This is My header
                    </p>
                </div>
            </div>
        </header>
    </body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...