Текстовые узлы на JavaScript иногда не сливаются - PullRequest
Новая
       53

Текстовые узлы на JavaScript иногда не сливаются

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

При объединении 3 текстовых узлов в 3 разных абзацах первые два пс не объединяются в одном из текстовых узлов. Следует объединить имя Роберт между двумя другими текстовыми узлами. Это работает только в последней части цикла. (смотрите, как должна выглядеть последняя строка). На консоли не отображается ошибка.

Можете ли вы сказать, почему это не работает? Или, может быть, есть лучший способ объединения текстовых узлов, о которых вы знаете?

Это упражнение для школы; Я должен использовать DOM на JavaScript. Я приложил скриншоты результата. 

document.addEventListener('DOMContentLoaded', function() {

  var sing = document.getElementById('sing');

  sing.addEventListener('click', function() {


    var friend1 = document.createElement('div');
    friend1.className = "friend";
    var friend1h3 = document.createElement('h3');
    var robert = document.createTextNode('Robert');
    friend1h3.appendChild(robert);
    document.body.appendChild(friend1h3);


    for (var i = 99; i > 0; i--) {
      var friend1p = document.createElement('p');
      if (i > 2) {
        var a = document.createTextNode((i) + " lines of code in the file, " + (i) + " lines of code; ");
        friend1p.appendChild(a);
        friend1p.appendChild(robert);
        var b = document.createTextNode(" strikes one out, clears it all out " + (i - 1) + " lines of code in the file");
        friend1p.appendChild(b);

      } else if (i === 2) {
        var c = document.createTextNode("2 lines of code in the file, 2 lines of code; ");
        friend1p.appendChild(c);
        friend1p.appendChild(robert);
        var d = document.createTextNode(" strikes one out, clears it all out 1 line of code in the file");
        friend1p.appendChild(d);

      } else {
        var e = document.createTextNode("1 line of code in the file, 1 line of code; ");
        friend1p.appendChild(e);
        friend1p.appendChild(robert);
        var f = document.createTextNode(" strikes one out, clears it all out, 0 lines of code in the file");
        friend1p.appendChild(f);
      }
      document.body.appendChild(friend1p);
    }
  })
})
<button type="button" id="sing">Click</button>

enter image description here

from 99 to 2, it's not including

1 Ответ

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

Вы перемещаете узел Роберта вместо добавления клона

AppendChild:

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

document.addEventListener('DOMContentLoaded', function() {

  var sing = document.getElementById('sing');

  sing.addEventListener('click', function() {


    var friend1 = document.createElement('div');
    friend1.className = "friend";
    var friend1h3 = document.createElement('h3');
    var robert = document.createTextNode('Robert');
    friend1h3.appendChild(robert);
    document.body.appendChild(friend1h3);


    for (var i = 10; i > 0; i--) {
      var friend1p = document.createElement('p');
      if (i > 2) {
        var a = document.createTextNode((i) + " lines of code in the file, " + (i) + " lines of code; ");
        friend1p.appendChild(a);
        friend1p.appendChild(robert.cloneNode());
        var b = document.createTextNode(" strikes one out, clears it all out " + (i - 1) + " lines of code in the file");
        friend1p.appendChild(b);

      } else if (i === 2) {
        var c = document.createTextNode("2 lines of code in the file, 2 lines of code; ");
        friend1p.appendChild(c);
        friend1p.appendChild(robert.cloneNode());
        var d = document.createTextNode(" strikes one out, clears it all out 1 line of code in the file");
        friend1p.appendChild(d);

      } else {
        var e = document.createTextNode("1 line of code in the file, 1 line of code; ");
        friend1p.appendChild(e);
        friend1p.appendChild(robert.cloneNode());
        var f = document.createTextNode(" strikes one out, clears it all out, 0 lines of code in the file");
        friend1p.appendChild(f);
      }
      document.body.appendChild(friend1p);
    }
  })
})
<button type="button" id="sing">Click</button>
...