#javascript #html #hyperlink
#javascript #HTML #гиперссылка
Вопрос:
Я хочу создать веб-страницу с динамическим заголовком, который изменяется в зависимости от ссылки, на которую я нажал на другой странице.
Допустим, у меня есть страница с двумя ссылками
<a href="somePage.html">link 1</a>
<a href="somePage.html">link 2</a>
и в «somePage.html » У меня есть заголовок, который я хочу изменить в соответствии со ссылкой, по которой я нажал (ссылка 1 или ссылка 2).
<h2>you were directed from [here I should insert link 1 or link 2] </h2>
Я могу использовать только html, css и JS, и логика должна быть на интерфейсе.
Любой способ сделать это?
Ответ №1:
Может быть, вы можете добавить параметр запроса к каждой ссылке:
<a href="somePage.html?page=link 1">link 1</a>
<a href="somePage.html?page=link 2">link 2</a>
<div id='redirected-from'></div>
<script>
const urlParams = new URLSearchParams(window.location.search);
let text = urlParams.get('page');
// escape amp;, <, >, " and '
linkText = text.replace(/amp;/g, "amp;amp;")
.replace(/</g, "amp;<")
.replace(/>/g, "amp;>")
.replace(/"/g, "amp;quot;")
.replace(/'/g, "amp;#039;");
document.getElementById("redirected-from").innerHTML = `<h2>You were directed from ${linkText}</h2>`
</script>
Комментарии:
1. Никогда не вводите необработанный HTML из строки запроса на страницу. Это должно быть проверено на безопасность.
2. Не совсем. Вы можете получить эффект новой строки с неразрывными пробелами. У него просто нет хороших горизонтальных правил. imgur.com/a/Mgevvgk