Append текст в существующий тег диапазона

У меня есть следующие HTMLAppend текст в существующий тег диапазона

<div class="card-text" data-test-info-type="price"> 
    <div class="price-section price-section--withoutTax "> 
     <span data-product-price-without-tax="" class="price price--withoutTax">$20.00</span> 
    </div> 
</div>

Я пытаюсь добавить следующий текст к $ 20.00 Цены включают налоги

Таким образом, конечный результат будет $ 20.00 Цены включают налоги

Однако я ударять кирпичную стену, пытаясь достичь этого я попытался следующие:

var span = document.getElementsByClassName("price price--withoutTax"); 
var txt = document.createTextNode("Prices include taxes"); 
span.innerText = txt.textContent;

Тем не менее он оставался $ 20,00

Затем я попытался

document.getElementsByClassName('price price--withoutTax').innerHTML = "hello";

Опять же результат остался в $ 20,00

Может кто-нибудь пролить некоторый свет на то, как я могу идти о добавляя дополнительный текст в тег диапазона?

источник

2016-09-09 Code Ratchet

'getElementsByClassName' возвращает список. Вы должны установить индекс (например, [0]). –

В чем смысл создания текстового узла только для получения его текстового содержимого? Почему бы просто не использовать строку '" Цены ... "' напрямую? Кроме того, как только вы исправляете проблему с возвратом списка 'getElementsByClassName', вы переписываете существующее содержимое диапазона, а не добавляете его в содержимое. – nnnnnn

@CodeRatchet, я думаю, что для правильного решения, помимо этого, добавьте свой вопрос, также проверьте этот http://stackoverflow.com/questions/19030742/difference-between-innertext-and-innerhtml-in-javascript#19030857 и – sakhunzai

Дело в том, что document.getElementsByClassName возвращает коллекцию HTML или кучу элементов в структуре типа «массив». Так значит, это:

var span = document.getElementsByClassName("price price--withoutTax"); 
span.innerText = ...;

не будет работать, потому что span не один элемент, это список. Даже если у вас есть один элемент с именем класса, он вернет вам список только одного элемента. Если вы хотите только первый элемент, или только с помощью первого элемента, сделайте следующее:

var span = document.getElementsByClassName("price price--withoutTax")[0];

Обратите внимание на [0]. Это обеспечивает доступ к первому элементу массива как возвращаемое значение document.getElementByClassName, давая вам первый элемент с заданным именем класса. Если вы хотите получить значение более чем одного из элементов, вы можете зацикливаться на нем и делать что-либо для каждого элемента.

источник

2016-09-09 03:47:17 Li357

Append текст в существующий тег диапазона

ответ

Смежные вопросы