2016-02-11 4 views
0

Возможно ли в jquery вставить текст после span. Например, я хотел бы изменить значение цены после знака доллара ниже.Изменение текста после пробела

<div id="price"> 
    <span>$</span> 
    10.00 
</div> 

Единственный способ, которым я могу видеть, как это сделать, чтобы удалить калибровочный элемент (сохранить в качестве переменной), добавьте значение цены, а затем добавить значение валюты снова. Кажется довольно хаки.

+1

Вы можете сделать это путем доступа (и изменения значения) textnode, удерживая сумму, как показано здесь: https://jsfiddle.net/7mdyg LLs/ – techfoobar

+0

Почему это проголосовало и проголосовало за закрытие? –

+0

Интересно, почему. Не могу найти ничего плохого в этом вопросе. – techfoobar

ответ

1

Вы можете изменить цену, используя lastChild и nodeValue как следующее.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="price"> 
 
    <span>$</span> 
 
    10.00 
 
</div> 
 

 
<script> 
 
    var price = $('#price')[0]; 
 
    price.lastChild.nodeValue = "155.00"; 
 
</script>

2

Да, вы можете сделать это, как:

$("#price").contents(":not(span)").text("Text"); 
1

Просто добавьте еще один пролет, чтобы обернуть вокруг значения цены.

<div id="price"> 
    <span>$</span> 
    <span id="price-value">10.00</span> 
</div> 

Затем вы можете $("#price-value") манипулировать эту часть самостоятельно.

0

попробовать это

$("#pri").text("100");
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="price"> 
 
    <span id='si'>$</span> 
 
    <span id='pri'>10.00</span> 
 
</div>

0

один другой способ

<script src="http://code.jquery.com/jquery.min.js"></script> 
<div id="price"> 
    <span>$</span> 
    10.00 
</div> 
<script type="text/javascript"> 
$('#price').contents().last()[0].textContent=' 20.00'; 
</script> 
0

Установка текста нужна старинке помощь JavaScript. Использование textContent.

$('#price').contents().filter(function() { 
 
    return this.nodeType == 3; 
 
}).last()[0].textContent = 'changed';
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
<div id="price"> 
 
    <span>$</span> 
 
    10.00 
 
</div>

0

Вы можете попробовать InsertAfter() в JQuery.

HTML:

<button>Insert span element after span element</button> 
<br> 
<div id="price"> 
<span>$</span> 
</div> 

JQuery:

$(document).ready(function(){ 
    $("button").click(function(){ 
    $("<span>100</span>").insertAfter("span"); 
    }); 
}); 
1

В гораздо проще альтернативы, можно также использовать CSS предварять символ валюты. Это позволяет избежать использования всего диапазона и позволяет менять символ валюты.

CSS Примеры:

.currency div::before { content: "$" } 
.currency.yen div::before { content: "¥" } 

И рабочий фрагмент кода:

$('#item1').html('10.00'); 
 

 
$('#item2').html('8.80'); 
 
         
 
$('#item3').html('20.30');
.currency.dollar div::before { content: "$" } 
 
.currency.pound div::before { content: "£" } 
 

 
.currency { 
 
    font-family: monospace; 
 
    font-size: 24px; 
 
    font-weight: bold; 
 
    border: 1px lightgray solid; 
 
    width: 8em; 
 
    padding: 4px; 
 
    text-align: right; 
 
    background-color: ghostwhite; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 

 
<div class="currency dollar"> 
 

 
    <div id="item1"></div> 
 

 
    <div id="item2"></div> 
 

 
    <div id="item3"></div> 
 

 
</div>

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