Как в JavaScript вставить текст в HTML элемент?

Question

[Евгений]

Необходимо вставить текст из кода на JavaScript в HTML элемент (Bootstrap panel в panel-body). Проблема в том, что если использовать innerHTML или appendChild, то текст начинает вылезать за пределы элемента (панели). То есть на него не действуют свойства родительского элемента.
Как правильно вставить текст?

Answer 1

[Anton Filippov]

.append() - добавить
.html() заменить

Comments

[Евгений]

Можете на примере написать? Не совсем понял что к чему.

[Rabinzon]

Евгений: $(".text-div").append("text"); Нужно подключить jq.

[Skaizy]

.append() мне помогло чтобы дописать к существующему тексту, не удаляя тот который есть, по скольку innetHTML переписывает...

пример:
const link = document.querySelector('a');
link.append(' my link')

Answer 2

[Ярослав Самардак]

var el = document.getElementById('id');

if (typeof elem.textContent !== "undefined") {
    el.textContent = 'text';
} else {
    el.innerText = 'text';
}

el.innetHTML = '<p>text</p>'

А то, что вылезает за пределы — фиксится средствами CSS, самое банальное overflow: hidden

Comments

[Maxim Zhgulev]

не none а hidden, поправьте

[Ярослав Самардак]

Поправил, спасибо!

[Finom]

innerText - это специфичное для старых ослов свойство. Нужно юзать textContent