Учитывая HTML-документ и задача состоит в том, чтобы изменить текст элемента span. Есть два свойства, используемые для изменения содержимого.
- HTML DOM textContent Property: это свойство устанавливает / возвращает текстовое содержимое определенного узла и всех его потомков. Устанавливая свойство textContent, дочерние узлы удаляются и заменяются одним текстовым узлом с указанной строкой.
Синтаксис:
- Вернуть текстовое содержимое узла:
Установите текстовое содержимое узла:
Значения свойства: содержит текст с одним значением, который определяет текстовое содержимое указанного узла.
Возвращаемое значение: возвращает строку, представляющую текст узла и всех его потомков. Он возвращает ноль, если элемент является документом, типом документа или нотацией.
HTML DOM innerText Свойство: Это свойство устанавливает / возвращает текстовое содержимое определенного узла и всех его потомков. При установке свойства innerText все дочерние узлы удаляются и заменяются одним текстовым узлом с указанной строкой.
Синтаксис:
- Вернуть текстовое содержимое узла:
Установите текстовое содержимое узла:
Значения свойства: содержит текст с одним значением, который определяет текстовое содержимое указанного узла.
Возвращаемое значение: возвращает строку, представляющую «визуализированное» текстовое содержимое узла и всех его потомков.
Пример 1. Этот пример изменяет содержимое с помощью свойства textContent .
HTML DOM позволяет JavaScript изменять содержимое элементов HTML.
Изменение выходного потока HTML
JavaScript может создавать динамическое HTML-содержимое:
В JavaScript документ. Write () можно использовать для записи непосредственно в выходной поток HTML:
Если у меня есть промежуток, скажите:
Как использовать JavaScript для изменения » hereismytext «на»newtext»?
10 ответов
редактировать Для современных браузеров :
используя innerHTML is ТАК НЕ РЕКОМЕНДУЕТСЯ. Вместо этого следует создать textNode. Таким образом, вы» привязываете » свой текст, и вы не уязвимы, по крайней мере, в этом случае, для атаки XSS.
дополнительные сведения об этой уязвимости: межсайтовые Скрипты (XSS) — OWASP
отредактировано 4 ноября 2017:
доработанная третья строка кода согласно @mumush предложение: «используйте appendChild (); вместо».
Кстати, согласно @Jimbo Jonny я думаю, что все должно рассматриваться как пользовательский ввод, применяя принцип безопасности по слоям. Таким образом, вы не встретите никаких сюрпризов.
EDIT: это было написано в 2014 году. Вы, вероятно, больше не заботитесь о IE8 и можете забыть об использовании innerText . Просто используйте
Я использую Jquery и ничего из вышеперечисленного помогло, я не знаю, почему, но это работает:
вот еще один способ:
свойство innerText будет обнаружено Safari, Google Chrome и MSIE. Для Firefox стандартным способом было использовать textContent, но с версии 45 у него тоже есть свойство innerText, как кто-то любезно сообщил мне недавно. Это решение проверяет, поддерживает ли браузер одно из этих свойств, и если да, назначает «newtext».
Как и в другом ответе,innerHTML и через свойство innerText не рекомендуется, лучше использовать textContent. Этот атрибут хорошо поддерживается, вы можете проверить это: http://caniuse.com/#search=textContent
это выберет dom-узел с id myspan и измените его текстовое содержимое на new text
в дополнение к чистым ответам javascript выше, вы можете использовать jQuery текст метод следующим образом:
Если вам нужно расширить ответ, чтобы получить/изменить HTML-код содержимое span или div-элементов, вы можете сделать это:
Источник: