html — Javascript, как изменить заголовок страницы с помощью пользовательского ввода
То, что я хочу сделать, это когда пользователь пишет что-то для ввода и подводит его, страница изменится на ввод.
Пример:
Если пользователь напишет на входе «Web», заголовок страницы должен измениться на «Web»
Вот код:
JS:
document.getElementById("titleSumbitBtn").onclick = function ( ){ var newTitle = document.getElementById("newTitle").textContent; document.getElementById("title").innerHTML = newTitle; }
HTML:
<голова> <мета-кодировка="UTF-8">Веб-редактор <тело>
<тип ввода="текст">
- JavaScript
- HTML
2
Вы можете присвоить документу новый заголовок следующим образом:
document. getElementById("titleSumbitBtn").onclick = function (){ var newTitle = document.getElementById("newTitle").value; документ.заголовок = новыйЗаголовок; }
Это фактическая реализация, но имейте в виду, что она должна запускаться после элемента DOM с идентификатором newTitle
.
Если вы поместите тег
внутрь,вам понадобится
DOMContentLoaded
:
document.addEventListener('DOMContentLoaded',()=>{document.getElementById("titleSumbitBtn").onclick=функция(){var newTitle=document.getElementById("newTitle").value;документ.заголовок=новыйЗаголовок;}})6
попробуйте это:
document.getElementById("titleSumbitBtn").addEventListener("click", function (){ var newTitle = document.getElementById("newTitle").value; document.getElementById("title").innerText = newTitle;
})
Зарегистрируйтесь или войдите в систему
Зарегистрируйтесь с помощью Google
Зарегистрироваться через Facebook
Зарегистрируйтесь, используя электронную почту и пароль
Опубликовать как гость
Электронная почта
Требуется, но никогда не отображается
Опубликовать как гость
Электронная почта
Требуется, но не отображается
Как динамически изменить заголовок веб-страницы с помощью JavaScript?
Улучшить статью
Сохранить статью
- Уровень сложности: Easy
- Последнее обновление: 22 декабря 2022 г.
Улучшить статью
Сохранить статью
Дана веб-страница, содержащая заголовок страницы, и задача состоит в том, чтобы динамически изменить заголовок веб-страницы с помощью JavaScript.
Способ 1. Использование свойства JavaScript document.title .
Это свойство используется для установки или возврата текущего заголовка документа. Заголовок страницы можно изменить, назначив этому свойству новый заголовок в виде строки. Это изменит название веб-сайта на предпочтительное название.
Синтаксис:
newPageTitle = 'Заголовок изменился!'; document.title = новыйPageTitle;
Example:
html
function changePageTitle() { |
Вывод:
Метод 2: Использование DOM Метод querySelector9.
Этот метод используется для выбора элементов в документе. Элемент заголовка можно выбрать, указав элемент заголовка в селекторе в качестве параметра. Это вернет текущий элемент заголовка страницы. Свойство textContent элемента возвращает текстовое содержимое определенного узла. Заголовок страницы можно изменить, присвоив требуемый новый заголовок в виде строки свойству textContent.
Синтаксис:
newPageTitle = 'Заголовок изменился!'; document.querySelector('title').textContent = newPageTitle;
Example:
html
b > >0031 function changePageTitle() { |