jQuery вставить текст после </span> - PullRequest
Новая
       8

jQuery вставить текст после </span>

0 голосов
/ 17 мая 2018

У меня есть этот HTML-код: 

<!-- informations -->
        <div class="simple_layer">
            <div class="main_container">
                <!-- user information -->
                <div class="main_content">
                    <span class="label">Account number:</span> ACCOUNT<br>
                    <span class="label">Tariff plan:</span> PLAN<br>
                    <span class="label">End date:</span> 05.23.2019 (371 days)<br>
                </div>
            </div>

        </div>

Мне нужно заменить в каждом тексте span, поэтому я пробую это с помощью jQuery: 

$(".simple_layer .main_content").find("span")[0].innerHTML += ' kk<br>';

Но это не заменяет ACCOUNT на kkя получаю этот вывод: 

Account number:kk ACCOUNT

И мне нужно получить это: 

Account number: kk

Ответы [ 3 ]

0 голосов
/ 17 мая 2018

Добавьте свое значение, используя отдельный тег span. Так что мы можем легко определить это в jquery. Пожалуйста, обратитесь ниже образец. Чтобы заменить все значения, которые вы должны использовать для цикла и применить ту же логику внутри цикла. 

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("p").click(function(){

        $(".simple_layer .main_content").find(".value")[0].innerHTML = ' kk';
    });
});
</script>
</head>
<body>

<div class="simple_layer">
            <div class="main_container">
                <!-- user information -->
                <div class="main_content">
                    <span class="label">Account number:</span> <span class="value">ACCOUNT</span><br>
                    <span class="label">Tariff plan:</span> PLAN<br>
                    <span class="label">End date:</span> 05.23.2019 (371 days)<br>
                </div>
            </div>

 </div>

 <p> Click Me </p>
 <div class="output"> </div>

</body>
</html>
0 голосов
/ 17 мая 2018 

jQuery("#account").replaceWith('kk')
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="simple_layer">
            <div class="main_container">
                <!-- user information -->
                <div class="main_content">
                  <span class="label">Account number:</span> <span id="account">ACCOUNT</span><br>
                    <span class="label">Tariff plan:</span> PLAN<br>
                    <span class="label">End date:</span> 05.23.2019 (371 days)<br>
                </div>
            </div>

        </div>

Эй, вы можете сделать простой способ, так как я только что добавил новый идентификатор и заменил текст с помощью функции jwery replacewith ()

0 голосов
/ 17 мая 2018

С помощью следующего кода я извлекаю только промежутки, добавляю к ним «kk» и добавляю их в строку. Затем я заменил HTML в main_content на новую строку. 

var spanCollection = $(".simple_layer .main_content").getElementsByTagName("span");
var newMainContentHTML = "";

for (var i = 0; i < spanCollection.length; i++) {
    newMainContentHTML += spanCollection[i].innerHTML + " kk<br/>";
}

$(".main_content").innerHTML = newMainContentHTML;
...