2

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Task 6</title>
</head>
<body>
    <div class="gold" id="text1">
        <ul>
            <li>1~~2~~3</li>
        </ul>
    </div>
     <div class="gold" id="text1">
        <ul>
            <li>1~~2~~3</li>
        </ul>
    </div>
    <script>
        var listItems = document.getElementById("text1").getElementsByTagName("LI");
        for(var i = 0; i < listItems.length; i++) {
            var listItem = listItems[i];
 
            var listItemContent = listItem.textContent;
            listItem.innerHTML = listItemContent.split("~~").join("</li><li>");
        }
    </script>
</body>
</html>

Как сделать, чтоб замена шла не только первому id? а и остальные

8
  • 1
    ид должен быть уникальным в пределах страницы
    – Alex
    20 апр 2017 в 20:27
  • У вас два раза id="text1", что есть ошибка
    – br3t
    20 апр 2017 в 20:27
  • У меня есть одинаковые 3 новости с одинаковым id
    – Never3D
    20 апр 2017 в 20:27
  • Чтобы манипулировать элементами у них должны быть разные id
    – br3t
    20 апр 2017 в 20:28
  • ещё раз - ид уникальный должен быть. класс у всех новостей одинаковый и вы его используете для перебора, стилизации и т.д.
    – Alex
    20 апр 2017 в 20:30

2 ответа 2

2

var goldDivs = document.querySelectorAll(".gold");

for (var j = 0; j < goldDivs.length; j++) {
  if (goldDivs[j].id == "text1") {
    var listItems = goldDivs[j].querySelectorAll("li");
    for (var i = 0; i < listItems.length; i++) {
      var listItem = listItems[i];
      var items = listItem.innerText.split("~~");
      for (var k = 0; k < items.length; k++){
        var itemChild = document.createElement("li");
        itemChild.innerText = items[k];
        listItem.parentElement.appendChild(itemChild);
      }
      listItem.parentElement.removeChild(listItem);
      
    }
  }
}
<div class="gold" id="text1">
  <ul>
    <li>a~~b~~c</li>
  </ul>
</div>
<div class="gold" id="text1">
  <ul>
    <li>1~~2~~3</li>
  </ul>
</div>

8
  • Uncaught SyntaxError: Unexpected token }
    – Never3D
    20 апр 2017 в 20:35
  • jsfiddle.net/n3r3hds1 не работает(
    – Never3D
    20 апр 2017 в 20:37
  • Что не работает?
    – user176262
    20 апр 2017 в 20:38
  • Есть текст <li>1~~2~~3</li> Как заменить ~~ на li и закрыть его же
    – Never3D
    20 апр 2017 в 20:39
  • <li>1</li> <li>2</li> <li>3</li> Вот так должно получиться заменить по сути ~~
    – Never3D
    20 апр 2017 в 20:39
1

    <div class="gold" id="text1">
        <ul>
            <li>1~~2~~3</li>
        </ul>
    </div>
     <div class="gold" id="text1">
        <ul>
            <li>1~~2~~3</li>
        </ul>
    </div>
    <script>
        var elements = document.getElementsByClassName('gold');
       
        for(var i = 0; i < elements.length; i++) {
            var el = elements[i].getElementsByTagName("LI");
						
            var listItemContent = el[0].textContent;
            
            
            el[0].innerHTML = listItemContent.split("~~").join("</li><li>");
        }
    </script>

По id так не получается потому что id должно быть уникальным. Поэтому нужно пользоваться классом например:

document.getElementsByClassName('имя класса');

Получив массив с которым мы уже можем делать что нам нужно.

P.S: компилятор не ругается на одинаковые id ,просто если он нашел первое совпадение, то остальное игнорирует.

3
  • и это работает)
    – Never3D
    20 апр 2017 в 20:49
  • А как сделать, чтоб каждая заглавная буква шла с новой строчки?
    – Never3D
    20 апр 2017 в 21:15
  • @Never3D, уточните вопрос
    – vov4ok
    20 апр 2017 в 22:34

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.