Обернуть каждые 5 div
Как обернуть список из 5 элементов еще одним DIV?
Т.е. есть список: <div class="n1">...</div> <div class="n2">...</div> <div class="n3">...</div> <div class="n4">...</div> <div class="n5">...</div> <div class="n6">...</div> <div class="n7">...</div> <div class="n8">...</div> <div class="n9">...</div> <div class="n10">...</div> ... <div class="nn">...</div> и чтоб в итоге получилось <div> <div class="n1">...</div> <div class="n2">...</div> <div class="n3">...</div> <div class="n4">...</div> <div class="n5">...</div> </div> <div> <div class="n6">...</div> <div class="n7">...</div> <div class="n8">...</div> <div class="n9">...</div> <div class="n10">...</div> </div> ... <div> <div class="nn-4">...</div> <div class="nn-3">...</div> <div class="nn-2">...</div> <div class="nn-1">...</div> <div class="nn">...</div> <div> |
<!DOCTYPE HTML> <html> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script> </head> <body> <div class="elements"> <div class="n1">...</div> <div class="n2">...</div> <div class="n3">...</div> <div class="n4">...</div> <div class="n5">...</div> <div class="n6">...</div> <div class="n7">...</div> <div class="n8">...</div> <div class="n9">...</div> <div class="n10">...</div> </div> <script> var $c = $('.elements'); while($c.children('div:not(.wrap)').length) $c.children('div:not(.wrap):lt(5)').wrapAll('<div class="wrap">'); </script> </body> </html> |
Жесть, изменил код под себя
var $c = $('.dropdown_2columns .level2'); while($c.children('.dropdown_2columns .level2 > li:not(.wrap)').length) $c.children('.dropdown_2columns .level2 > li:not(.wrap):lt(3)').wrapAll('<div class="nav-column">'); И от него у меня виснет сайт) |
Цитата:
|
<html> <head> <style> .foo{margin: 10px} </style> </head> <body> <div id = "container"> <div>foo</div> <div>foo</div> <div>foo</div> <div>foo</div> <div>foo</div> <div>foo</div> <div>foo</div> <div>foo</div> <div>foo</div> <div>foo</div> <div>foo</div> <div>foo</div> <div>foo</div> <div>foo</div> <div>foo</div> <div>foo</div> <div>foo</div> <div>foo</div> <div>foo</div> <div>foo</div> </div> <script> var re = /(<div[^>]*>[^<]*<\s*\/div\s*>\s*){5}/g container.innerHTML = container.innerHTML.replace(re, `<div class = "foo">$&</div>`) </script> <body> </html> |
scrollquest,
всю обработку событий удалит ... |
рони,
Ты реально заебал своим тупняком. Ты где у ТСа обработку событий увидел? |
emptyindorill,
если класс поменяли в 3 строке измените и в 2!!! Цитата:
Цитата:
|
scrollquest,
пишите безопасный код и будет вам счастье. |
рони,
Вас, видимо, в детстве головой об стенку частенько роняли. Может и манипуляции с домом запретить на этом основании? Висело событие на элементе, а ты этот элемент заменил чем то, хуяк, и нет события? А? Может нуенахуй вообще это жаваскрипт, отрисовал раз документ, и норм? Цитата:
|
обернуть элементы на js
emptyindorill,
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <style type="text/css"> li{ padding:5px; } .nav-column { border: 1px solid Blue; margin: 3px; list-style: none; } </style> <title></title> <script> document.addEventListener('DOMContentLoaded', fn, false); function wrapEach(element, wrapper, countToWrap, cls){ var container; [].forEach.call( document.querySelectorAll(element), function(el,i) { i % countToWrap || (container = document.createElement(wrapper), cls && container.classList.add(cls), el.parentNode.replaceChild(container,el)); container.appendChild(el); }); } function fn() { wrapEach('.dropdown_2columns .level2>li','div',5,'nav-column'); } </script> </head> <body> <div class="dropdown_2columns"> <ul class="level2"> <li>1</li> <li>2</li> <li>3</li> <li>4</li> <li>5</li> <li>6</li> <li>7</li> <li>8</li> <li>9</li> <li>10</li> <li>11</li> <li>12</li> <li>13</li> <li>14</li> <li>15</li> <li>16</li> <li>17</li> </ul> </div> </body> </html> |
Еще как вариант. :)
jQuery(function ( $ ) { var $div = $('div'); $div.each(function (i, el) { if ( i % 5 === 0 ) { $div.slice(i, i+5).wrapAll('<div />'); } }); }); |
Цитата:
Уже сколько времени прошло, и снова я в этой теме) Помогло. |
Часовой пояс GMT +3, время: 00:34. |