Закрыть и открыть блоки с помощью after() и before()
Здравствуйте.
Имеется простой html-код: <div class="content"> <div class="container"> <div class="page"> <ul class="page__list"> <li><a href="javascript:void(0)">Главная</a></li> <li><a href="javascript:void(0)">Личный кабинет</a></li> <li><span>Мой список заказов</span></li> </ul> <div class="sorting"> <span class="sorting__title">Сортировка:</span> <div class="sorting__list"> <select class="select-list"> <option value="1" selected>По дате</option> <option value="2">По популярности</option> <option value="3">По цене</option> </select> </div> </div> </div> <div class="titleBox titleBox--left"><h1>Условия для оптовых клиентов</h1></div> <div class="text"> <p>Посмотрите на то, чем торгуют люди, пройдите по городу и досмотрите, что продается: наряды и предметы для объядения. Они с полчаса как кончили работу, так что в этот день мы могли сидеть только пустые каморы. </p> <h4>Подзаголовок например 1</h4> <p>Всех обитательниц этой Камеры было пятнадцать: двенадцать женщин и трое детей. Предводитель был либеральный человек, и он вместе с некоторыми единомышленниками боролся против наступившей при Александре III реакции и весь был поглощен этой борьбой и ничего не знал о своей несчастной семейной жизни. Даже на тюремном дворе был свежий, живительный воздух полей, принесенный ветром в город. Но в коридоре был удручающий тифозный воздух, пропитанный запахом испражнений, дегтя и гнили, который тотчас же приводил в уныние и грусть всякого вновь приходившего человека. Это испытала на себе, несмотря на привычку к дурному воздуху, пришедшая со двора надзирательница. Она вдруг, входя в коридор, почувствовала усталость, и ей захотелось спать.</p> <p>Всех обитательниц этой Камеры было пятнадцать: двенадцать женщин и трое детей. Предводитель был либеральный человек, и он вместе с некоторыми единомышленниками боролся против наступившей при Александре III реакции и весь был поглощен этой борьбой и ничего не знал о своей несчастной семейной жизни. Даже на тюремном дворе был свежий, живительный воздух полей, принесенный ветром в город. Но в коридоре был удручающий тифозный воздух, пропитанный запахом испражнений, дегтя и гнили, который тотчас же приводил в уныние и грусть всякого вновь приходившего человека. Это испытала на себе, несмотря на привычку к дурному воздуху, пришедшая со двора надзирательница. Она вдруг, входя в коридор, почувствовала усталость, и ей захотелось спать.</p> <div class="tagline"> <div class="container"> <div class="tagline__cont"> <div class="textTitle"> <h2>10 Лет помогаем людям со <br> всей страны не останавливаться на достигнутом</h2> <h4>Доставка по Москве и МО осуществляется нашими курьерами, которые всегда готовы проконсультировать Так же возможен самовывоз из нашего</h4> <a class="textTitle__link" href="javascript:void(0)">Смотреть каталог</a> </div> </div> </div> </div> <h4>Подзаголовок например 12</h4> <p>Всех обитательниц этой Камеры было пятнадцать: двенадцать женщин и трое детей. Предводитель был либеральный человек, и он вместе с некоторыми единомышленниками боролся против наступившей при Александре III реакции и весь был поглощен этой борьбой и ничего не знал о своей несчастной семейной жизни. Даже на тюремном дворе был свежий, живительный воздух полей, принесенный ветром в город. Но в коридоре был удручающий тифозный воздух, пропитанный запахом испражнений, дегтя и гнили, который тотчас же приводил в уныние и грусть всякого вновь приходившего человека. </p> <ul> <li>Она встала, подсела к нам, оживилась... и мы только в два часа ночи вспомнили, что доктора велят ложиться спать в одиннадцать. В одном из домов слободки, построенном на краю обрыва, заметил я чрезвычайное освещение; по временам раздавался нестройный говор и крики, изобличавшие военную пирушку. </li> <li>Я слез и подкрался к окну; неплотно притворенный ставень позволил мне видеть пирующих и расслышать их слова. Говорили обо мне. </li> <li>Расставшись с Максимом Максимычем, я живо проскакал Терекское и Дарьяльское ущелья, завтракал в Казбеке, чай пил в Ларсе, а к ужину поспел в Владыкавказ. Избавлю вас от описания гор, от возгласов, которые ничего не выражают, от картин, которые ничего не изображают, особенно для тех, которые там не были, и от статистических замечаний, которые решительно никто читать не станет.</li> </ul> </div> </div> </div> <!-- END .content --> При помощи jquery пытаюсь перед и после div.tagline закрыть и по-новой открыть два блока: $('div.content div.tagline').each(function(e) { $(this).before('</div></div>'); $(this).after('<div class="container"><div class="text">'); }); Но почему-то после загрузки страницы только после того, как закрывается div.tagline добавляется следующее: <div class="container"><div class="text"></div></div> Подскажите пожалуйста, как сделать правильно? |
GoodSanta,
что вы хотите сделать, если обернуть, то для этого есть http://api.jquery.com/wrap/ |
Цитата:
|
GoodSanta,
напишите html какой хотите получить |
Цитата:
<!-- .content --> <div class="content"> <div class="container"> <div class="titleBox titleBox--left"><h1>Условия для оптовых клиентов</h1></div> <div class="text"> <p>Посмотрите на то, чем торгуют люди, пройдите по городу и досмотрите, что продается: наряды и предметы для объядения. Они с полчаса как кончили работу, так что в этот день мы могли сидеть только пустые каморы. </p> <h4>Подзаголовок например 1</h4> <p>Всех обитательниц этой Камеры было пятнадцать: двенадцать женщин и трое детей. Предводитель был либеральный человек, и он вместе с некоторыми единомышленниками боролся против наступившей при Александре III реакции и весь был поглощен этой борьбой и ничего не знал о своей несчастной семейной жизни. Даже на тюремном дворе был свежий, живительный воздух полей, принесенный ветром в город. Но в коридоре был удручающий тифозный воздух, пропитанный запахом испражнений, дегтя и гнили, который тотчас же приводил в уныние и грусть всякого вновь приходившего человека. Это испытала на себе, несмотря на привычку к дурному воздуху, пришедшая со двора надзирательница. Она вдруг, входя в коридор, почувствовала усталость, и ей захотелось спать.</p> <p>Всех обитательниц этой Камеры было пятнадцать: двенадцать женщин и трое детей. Предводитель был либеральный человек, и он вместе с некоторыми единомышленниками боролся против наступившей при Александре III реакции и весь был поглощен этой борьбой и ничего не знал о своей несчастной семейной жизни. Даже на тюремном дворе был свежий, живительный воздух полей, принесенный ветром в город. Но в коридоре был удручающий тифозный воздух, пропитанный запахом испражнений, дегтя и гнили, который тотчас же приводил в уныние и грусть всякого вновь приходившего человека. Это испытала на себе, несмотря на привычку к дурному воздуху, пришедшая со двора надзирательница. Она вдруг, входя в коридор, почувствовала усталость, и ей захотелось спать.</p> </div> </div> <!-- .tagline --> <div class="tagline"> <div class="container"> <div class="tagline__cont"> <div class="textTitle"> <h2>10 Лет помогаем людям со <br> всей страны не останавливаться на достигнутом</h2> <h4>Доставка по Москве и МО осуществляется нашими курьерами, которые всегда готовы проконсультировать Так же возможен самовывоз из нашего</h4> <a class="textTitle__link" href="javascript:void(0)">Смотреть каталог</a> </div> </div> </div> </div> <!-- END .tagline --> <div class="container"> <div class="text"> <h4>Подзаголовок например 12</h4> <p>Всех обитательниц этой Камеры было пятнадцать: двенадцать женщин и трое детей. Предводитель был либеральный человек, и он вместе с некоторыми единомышленниками боролся против наступившей при Александре III реакции и весь был поглощен этой борьбой и ничего не знал о своей несчастной семейной жизни. Даже на тюремном дворе был свежий, живительный воздух полей, принесенный ветром в город. Но в коридоре был удручающий тифозный воздух, пропитанный запахом испражнений, дегтя и гнили, который тотчас же приводил в уныние и грусть всякого вновь приходившего человека. </p> <ul> <li>Она встала, подсела к нам, оживилась... и мы только в два часа ночи вспомнили, что доктора велят ложиться спать в одиннадцать. В одном из домов слободки, построенном на краю обрыва, заметил я чрезвычайное освещение; по временам раздавался нестройный говор и крики, изобличавшие военную пирушку. </li> <li>Я слез и подкрался к окну; неплотно притворенный ставень позволил мне видеть пирующих и расслышать их слова. Говорили обо мне. </li> <li>Расставшись с Максимом Максимычем, я живо проскакал Терекское и Дарьяльское ущелья, завтракал в Казбеке, чай пил в Ларсе, а к ужину поспел в Владыкавказ. Избавлю вас от описания гор, от возгласов, которые ничего не выражают, от картин, которые ничего не изображают, особенно для тех, которые там не были, и от статистических замечаний, которые решительно никто читать не станет.</li> </ul> </div> </div> </div> <!-- END .content --> |
GoodSanta,
<!DOCTYPE html> <html> <head> <title>Untitled</title> <meta charset="utf-8"> <style type="text/css"> </style> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <script> $(function() { $(".content .text").each(function(d, c) { var a; $("> *", c).each(function(d, b) { $(b).is(".tagline") ? ($(b).insertAfter(c), a = $('<div class="text"></div>'), $('<div class="container"></div>').append(a).insertAfter(b)) : a && $(b).appendTo(a) }) }) }); </script> </head> <body> <div class="content"> <div class="container"> <div class="page"> <ul class="page__list"> <li><a href="javascript:void(0)">Главная</a></li> <li><a href="javascript:void(0)">Личный кабинет</a></li> <li><span>Мой список заказов</span></li> </ul> <div class="sorting"> <span class="sorting__title">Сортировка:</span> <div class="sorting__list"> <select class="select-list"> <option value="1" selected>По дате</option> <option value="2">По популярности</option> <option value="3">По цене</option> </select> </div> </div> </div> <div class="titleBox titleBox--left"><h1>Условия для оптовых клиентов</h1></div> <div class="text"> <p>Посмотрите на то, чем торгуют люди, пройдите по городу и досмотрите, что продается: наряды и предметы для объядения. Они с полчаса как кончили работу, так что в этот день мы могли сидеть только пустые каморы. </p> <h4>Подзаголовок например 1</h4> <p>Всех обитательниц этой Камеры было пятнадцать: двенадцать женщин и трое детей. Предводитель был либеральный человек, и он вместе с некоторыми единомышленниками боролся против наступившей при Александре III реакции и весь был поглощен этой борьбой и ничего не знал о своей несчастной семейной жизни. Даже на тюремном дворе был свежий, живительный воздух полей, принесенный ветром в город. Но в коридоре был удручающий тифозный воздух, пропитанный запахом испражнений, дегтя и гнили, который тотчас же приводил в уныние и грусть всякого вновь приходившего человека. Это испытала на себе, несмотря на привычку к дурному воздуху, пришедшая со двора надзирательница. Она вдруг, входя в коридор, почувствовала усталость, и ей захотелось спать.</p> <p>Всех обитательниц этой Камеры было пятнадцать: двенадцать женщин и трое детей. Предводитель был либеральный человек, и он вместе с некоторыми единомышленниками боролся против наступившей при Александре III реакции и весь был поглощен этой борьбой и ничего не знал о своей несчастной семейной жизни. Даже на тюремном дворе был свежий, живительный воздух полей, принесенный ветром в город. Но в коридоре был удручающий тифозный воздух, пропитанный запахом испражнений, дегтя и гнили, который тотчас же приводил в уныние и грусть всякого вновь приходившего человека. Это испытала на себе, несмотря на привычку к дурному воздуху, пришедшая со двора надзирательница. Она вдруг, входя в коридор, почувствовала усталость, и ей захотелось спать.</p> <div class="tagline"> <div class="container"> <div class="tagline__cont"> <div class="textTitle"> <h2>10 Лет помогаем людям со <br> всей страны не останавливаться на достигнутом</h2> <h4>Доставка по Москве и МО осуществляется нашими курьерами, которые всегда готовы проконсультировать Так же возможен самовывоз из нашего</h4> <a class="textTitle__link" href="javascript:void(0)">Смотреть каталог</a> </div> </div> </div> </div> <h4>Подзаголовок например 12</h4> <p>Всех обитательниц этой Камеры было пятнадцать: двенадцать женщин и трое детей. Предводитель был либеральный человек, и он вместе с некоторыми единомышленниками боролся против наступившей при Александре III реакции и весь был поглощен этой борьбой и ничего не знал о своей несчастной семейной жизни. Даже на тюремном дворе был свежий, живительный воздух полей, принесенный ветром в город. Но в коридоре был удручающий тифозный воздух, пропитанный запахом испражнений, дегтя и гнили, который тотчас же приводил в уныние и грусть всякого вновь приходившего человека. </p> <ul> <li>Она встала, подсела к нам, оживилась... и мы только в два часа ночи вспомнили, что доктора велят ложиться спать в одиннадцать. В одном из домов слободки, построенном на краю обрыва, заметил я чрезвычайное освещение; по временам раздавался нестройный говор и крики, изобличавшие военную пирушку. </li> <li>Я слез и подкрался к окну; неплотно притворенный ставень позволил мне видеть пирующих и расслышать их слова. Говорили обо мне. </li> <li>Расставшись с Максимом Максимычем, я живо проскакал Терекское и Дарьяльское ущелья, завтракал в Казбеке, чай пил в Ларсе, а к ужину поспел в Владыкавказ. Избавлю вас от описания гор, от возгласов, которые ничего не выражают, от картин, которые ничего не изображают, особенно для тех, которые там не были, и от статистических замечаний, которые решительно никто читать не станет.</li> </ul> </div> </div> </div> <!-- END .content --> </body> </html> |
Спасибо, уже ближе. но в вашем варианте все равно все содержимое div.content завернуто в div.container
|
GoodSanta,
Цитата:
|
Цитата:
<div class="content"> <div class="container"> <div class="text"></div> </div> <div class="tagline"> </div> <div class="container"> <div class="text"></div> </div> </div> А получилось что-то вроде <div class="content"> <div class="container"> <div class="text"></div> <div class="tagline"> </div> <div class="container"> <div class="text"></div> </div> </div> </div> |
GoodSanta,
а на сервере сделать то что нужно? |
Часовой пояс GMT +3, время: 15:53. |