Java скрипт текста скачать

Как вывести текст в JavaScript.

Пишем название функции, совпадающее с onclick событием на кнопке, внутри фигурных скобочках, будем писать код функции. Для получения параграфа для работы: Присвоим переменной p следующий объект. Мы получили и положили в переменную p , весь параграф с идентификатором text_change . Для того, чтобы вывести что-нибудь (числа, строки) внутри любого парного тега, надо использовать конструкцию innerHTML . Получим целый параграф и вместо "Заменить текст" , выведем внутри p новую запись: p.innerHTML = 'Текст заменили'; После клика по кнопке, замена произошла успешно.

Нам интересно, а что произойдет с исходным кодом, после манипуляций с заменой? Заглянем в инспектор кода для разработчика и увидим, что в HTML коде, тоже произошли изменения. Что будет, если кавычки оставить пустыми? Тогда параграф очистится, текущая запись удалится, а новая не вставится. Добавить текст в JavaScript. Как добавить новый текст к уже существующему, не удаляя текущий?

p.innerHTML += ' на сайте '; Мы видим новый оператор присваивания += , который объединяет две строки. Это выражение можно записать и аналогичным образом. Эти две записи равнозначны. p.innerHTML = p.innerHTML + 'на сайте'; Берем, что имеется, прибавляем что-нибудь новое и записываем заново. Вы наверное заметили, что новый текст, заключен в кавычки вместе с тегами , а браузер не просто его добавил, но и обработал (добавил курсивное начертание).

В конструкции innerHTML , теги обрабатываются браузером. p.innerHTML += ' на сайте '; Теги выводятся, но не обрабатываются. p.innerText += ' на сайте '; Все действия, которые мы производили до этого, приводят к тому, что запись выводится между парными тегами.

Однако было бы удобно иметь возможность более гибко выводить дополнительную информацию по отношению к элементу. Такой способ есть и выглядит следующим образом. Это свойство позволяет выводить на экран информацию в разные места по отношению к текущему элементу. Оно имеет два параметра: первый параметр – где вывести информацию второй параметр – это что вывести. Свойство insertAdjacentHTML , позволяет выводить любое содержание в четырех позициях, как дополнение к текущему содержанию. beforeBegin - перед открывающим тегом afterBegin - после открывающего тега beforeEnd – перед закрывающим тегом afterEnd – после закрывающим тегом. Осталось рассмотреть ещё одно свойство – outerHTML . В чем между ними разница? innerHTML , заменяет содержимое тега, но сам тег оставляет прежним. outerHTML заменяет содержимое вместе с тегом.

Присвоим параграфу "Замена" всего вместе с div . Обратите внимание, что парный тег div снаружи заключен в одинарные кавычки, но внутри тега используются двойные кавычки. Это делается для того, чтобы не происходило разрыва строки. Кавычки снаружи и внутри должны быть разные. После нажатия на кнопку, текущие теги параграфа вместе с текстом, заменяются на div . В инспекторе кода, мы увидим уже новый код, на месте старого.