Показать сообщение отдельно
  #5 (permalink)  
Старый 03.07.2021, 20:28
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,127

дублирование содержимого в другие блоки
Was-Ja,
попытка облегчить понимание решения, предложенного Aetae,
<!DOCTYPE html>

<html>
<head>
    <title>Untitled</title>
    <meta charset="utf-8">
    <style type="text/css">
    </style>

    <script>
addEventListener('DOMContentLoaded', function() {
    var forEach = Function.prototype.call.bind(Array.prototype.forEach);
    var attribute = 'data-for';
    forEach(document.querySelectorAll('[' + attribute + ']'), function(element) {
        var cls = element.getAttribute(attribute);
        var fragment = document.createDocumentFragment();
            forEach(element.childNodes, function(node) {
                fragment.appendChild(node.cloneNode(true));
            });
        forEach(document.querySelectorAll(cls), function(element) {
        element.appendChild(fragment.cloneNode(true))
        })

    });
})
   </script>
</head>

<body>
<div class="add"></div>
<div  data-for='.label, .test' >это пример, будет во всех <b>div</b> с классами указанными в атрибуте <i>data-for</i>'.label, .test'</div>
<div class="label"></div>
<div class="label"></div>
<div class="label"></div>
<div class="label"></div>
<div class="red">а тут ничего не изменится</div>
<div class="test"></div>
<div class="test"></div>
<div class="test"></div>
<div class="add"></div>
<div  data-for='.add' >это пример, будет во всех <b>div</b> с классами указанными в атрибуте <i>data-for</i>'.add'</div>
</body>
</html>
Ответить с цитированием