Мне недавно удалось решить свой собственный вопрос: Изменить цвет выбранного
Но теперь у меня появилась новая проблема - после решения вышеуказанного вопроса я хотел изменить свой html файлов, так что они не все определяли один и тот же верхний баннер, навигацию по меню и код нижнего колонтитула, это казалось пустой тратой.
Поэтому я использовал Ajax, чтобы эффективно включить html файлы были Я нуждался в них, поэтому теперь у каждого из моих html файлов есть верхний и нижний колонтитулы в верхней и нижней частях страницы, и следующий код ajax заполняет эти элементы верхнего и нижнего колонтитула отдельными html файлами:
$(document).ready(function () {
fetch("./header.html")
.then(response => {
return response.text()
})
.then(data => {
document.querySelector("header").innerHTML = data;
});
fetch("./footer.html")
.then(response => {
return response.text()
})
.then(data => {
document.querySelector("footer").innerHTML = data;
});
});
Проблема в том, что теперь код, который решил мою предыдущую проблему (ссылка на которую приведена в начале этого вопроса), не работает, вот этот код:
$(document).ready(function () {
var path = window.location.pathname.substring(1);
path = path.substring(0, path.length - 5);
var pathShort = path.substring(path.indexOf("/")+1);
var activeLink = document.getElementById(pathShort);
activeLink.classList.add("active");
});
Я считаю, что " document.getElementById (pathShort);» вызов больше не работает, потому что технически элемент с идентификатором, равным pathShort, больше не находится на этой странице (не в документе), а находится в заголовке. html, который включается в ajax.
Так что мой вопрос, как я могу искать во включенном заголовке. html файл при вызове "document.getElementById (pathShort);"?