Как заменить текст внутри элемента div?

$('field_name').innerHTML = 'Your text.';

Одна из замечательных особенностей Prototype заключается в том, что $('field_name') делает то же самое, что и document.getElementById('field_name'). Используй это! :-)

Ответ Джона Топли с использованием функции Prototype update - еще одно хорошее решение.

Вы можете просто использовать:

fieldNameElement.innerHTML = "My new text!";

Если вы действительно хотите, чтобы мы просто продолжили с того места, на котором остановились, вы можете сделать:

if (fieldNameElement)
    fieldNameElement.innerHTML = 'some HTML';

Я бы использовал метод update от Prototype, который поддерживает простой текст, фрагмент HTML или любой объект JavaScript, определяющий метод toString.

$("field_name").update("New text");

• Element.update документация

function showPanel(fieldName) {
  var fieldNameElement = document.getElementById(field_name);

  fieldNameElement.removeChild(fieldNameElement.firstChild);
  var newText = document.createTextNode("New Text");
  fieldNameElement.appendChild(newText);
}

Быстрый ответ - использовать innerHTML (или метод обновления прототипа, что почти то же самое). Проблема с innerHTML заключается в том, что вам нужно избегать назначаемого содержимого. В зависимости от ваших целей вам нужно будет сделать это с другим кодом ИЛИ

в IE: -

document.getElementById("field_name").innerText = newText;

в FF: -

document.getElementById("field_name").textContent = newText;

(На самом деле FF имеет следующий код)

HTMLElement.prototype.__defineGetter__("innerText", function () { return this.textContent; })

HTMLElement.prototype.__defineSetter__("innerText", function (inputText) { this.textContent = inputText; })

Теперь я могу просто использовать innerText, если вам нужна максимально широкая поддержка браузера, тогда это не полное решение, но и не использует innerHTML в исходном виде.

function showPanel(fieldName) {
  var fieldNameElement = document.getElementById("field_name");
  while(fieldNameElement.childNodes.length >= 1) {
    fieldNameElement.removeChild(fieldNameElement.firstChild);
  }
  fieldNameElement.appendChild(fieldNameElement.ownerDocument.createTextNode(fieldName));
}

Преимущества этого:

1. Он использует только DOM, поэтому метод переносим на другие языки и не полагается на нестандартный innerHTML.
2. fieldName может содержать HTML, что может быть попыткой XSS-атаки. Если мы знаем, что это просто текст, мы должны создать текстовый узел вместо того, чтобы браузер анализировал его на предмет HTML.

Если бы я собирался использовать библиотеку javascript, я бы использовал jQuery и сделал бы следующее:

  $("div#field_name").text(fieldName);

Обратите внимание, что Комментарий @AnthonyWJones верен: «field_name» не является особенно описательным идентификатором или именем переменной.

Если вы склонны использовать на своем сайте много JavaScript, jQuery делает игру с DOM чрезвычайно простой.

http://docs.jquery.com/Manipulation

Делает это так просто, как: $ ("# field-name"). text ("Новый текст.");

Вот простой способ jQuery:

var el = $('#yourid .yourclass');

el.html(el.html().replace(/Old Text/ig, "New Text"));

nodeValue также является стандартным свойством DOM, которое вы можете использовать:

function showPanel(fieldName) {
  var fieldNameElement = document.getElementById(field_name);
  if (fieldNameElement.firstChild)
    fieldNameElement.firstChild.nodeValue = "New Text";
}

el.innerHTML='';
el.appendChild(document.createTextNode("yo"));

Обновлено для всех, кто читает это в 2013 году и позже:

В этом ответе много SEO, но все ответы сильно устарели и зависят от библиотек, которые делают то, что все текущие браузеры делают из коробки.

Чтобы заменить текст внутри элемента div, используйте Node.textContent, который предоставляется во всех текущих браузерах.

fieldNameElement.textContent = "New text";

Используйте innerText, если вы не можете предполагать структуру - Используйте данные Text # для обновления существующего текста Тест производительности

В HTML поместите это

<div id = "field_name">TEXT GOES HERE</div>

В Javascript поместите это

var fieldNameElement = document.getElementById('field_name');
        if (fieldNameElement)
        {fieldNameElement.innerHTML = 'some HTML';}