2017-01-11 5 views
0

Для DIV, который появляется несколько раз в вашем HTML:Как заменить несколько вхождений в innerHTML div с помощью javascript?

<div class="myclass">abc</div> 
<div class="myclass">abc def</div> 
... 

Как я могу добиться замены «ABC» для всех случаев? (я нашел ресурсы, чтобы заменить первое вхождение, но не остальные)

Это мой код с помощью метода яваскрипта

<script> 
function addLoadEvent(func) { 
    var oldonload = window.onload; 
    if (typeof window.onload != 'function') { 
    window.onload = func; 
    } else { 
    window.onload = function() { 
     if (oldonload) { 
     oldonload(); 
     } 
     func(); 
    } 
    } 
} 

addLoadEvent(function() { 

    oldText = document.getElementsByClassName("myclass").innerHTML; 
    for (i = 0; i<oldText.length; i++){ 
    newText = oldText[i].innerHTML; 
    newText = newText.replace(/abc/g, "123"); 
    oldText[i].innerHTML = newText; 

    }); 
</script> 
+2

Там буквально нет JQuery в этом примере? Это ванильный javascript, но вы также загружаете jquery без причины! Что именно здесь возникает, не работает ли это? – Liam

+0

Да, это не работает, я пытаюсь найти хороший метод для замены внутреннего текста в div, который возникает несколько раз. Возможно, я смутил себя между jquery и JS ... – KillM

+1

Ваш код работает, просто удалите '.innerHTML' из' document.getElementsByClassName («myclass») ' –

ответ

0

целевой каждый класс, разделенного значения, удалите индекс 0 и конкатенации.

$('.myclass').each(function(){ 
     var data = $(this).val(); 
     var data_array = data.split(); 
     var new = ''; 
     for(var i=1; i<data_array.length; i++){ 
      var _new += ' '+data_array[i]; 
     } 
     $(this).val(_new); 
    }); 
+0

Я не думаю, что OP хочет jquery. Он не знает, что это такое – Liam

+2

'new' является ключевым словом и не может использоваться как имя переменной. –

3

Вот решение:

Проблема заключается в этой строке: oldText = document.getElementsByClassName("myclass").innerHTML;

.innerHTML метод возвращает HTML содержание.

Вам нужно только получить элементы по имени класса и получить nodeList.

oldText = document.getElementsByClassName("myclass"); 

function addLoadEvent(func) { 
 
    var oldonload = window.onload; 
 
    if (typeof window.onload != 'function') { 
 
    window.onload = func; 
 
    } else { 
 
    window.onload = function() { 
 
     if (oldonload) { 
 
     oldonload(); 
 
     } 
 
     func(); 
 
    } 
 
    } 
 
} 
 
addLoadEvent(function() { 
 
    oldText = document.getElementsByClassName("myclass"); 
 
    for (i = 0; i<oldText.length; i++){ 
 
     newText = oldText[i].innerHTML; 
 
     newText = newText.replace(/abc/g, "123"); 
 
     oldText[i].innerHTML = newText; 
 
    } 
 
});
<div class="myclass">abc</div> 
 
<div class="myclass">abc def</div>

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