Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 17.02.2021, 12:30
Профессор
Отправить личное сообщение для Vaska Посмотреть профиль Найти все сообщения от Vaska
 
Регистрация: 08.05.2017
Сообщений: 178

Добавить теги внутри тега li
Привестствую!
Делаю верстку вкладок и чтобы стало красиво, нужно внутри тега li добавить парный тег DIV с атрибутом CLASS. Эти вкладки на десятках страниц, поэтому нужно скриптом добавить. Нужно, чтобы во всех популярных браузерах работало, в IE конечно тоже.

Сейчас так:
<div class="tabmenu">
    <ul class="tab">
        <li class="active"><a href="">Отправленные</a></li>
        <li><a href="">Системные</a></li>
    </ul>            
</div>


Нужно так:
<div class="tabmenu">
    <ul class="tab">
        <li class="active"><div class="tab-inner"><a href="">Title 1</a><div></li>
        <li><a href=""><div class="tab-inner">Title 2</a><div></li>
    </ul>            
</div>

Заранее спасибо.
Смотрел эту тему Как добавить div в уже существующий div
Не справился.
Ответить с цитированием
  #2 (permalink)  
Старый 17.02.2021, 12:53
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Vaska,
Сообщение от Vaska
чтобы стало красиво
достаточно css для .tab li
Ответить с цитированием
  #3 (permalink)  
Старый 17.02.2021, 12:56
Аватар для voraa
Профессор
Отправить личное сообщение для voraa Посмотреть профиль Найти все сообщения от voraa
 
Регистрация: 03.02.2020
Сообщений: 2,692

document.addEventListener('DOMContentLoaded', function () {
   var li, i;
   var lists = document.querySelectorAll(ul.tab>li');
   for ( i = 0; i<lists.length; i++) {
      li = lists[i];
      li.innerHTML = '<div class="tab-inner">' + li.innerHTML +'</div>';
   }
})
Ответить с цитированием
  #4 (permalink)  
Старый 17.02.2021, 12:58
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Vaska,
но если хочется погорячее
wrapEach('.tabmenu .tab li a', 'div', 1, 'tab-inner');

https://javascript.ru/forum/dom-wind...tml#post533431
Ответить с цитированием
  #5 (permalink)  
Старый 17.02.2021, 13:24
Профессор
Отправить личное сообщение для Vaska Посмотреть профиль Найти все сообщения от Vaska
 
Регистрация: 08.05.2017
Сообщений: 178

Сообщение от рони Посмотреть сообщение
Vaska,
но если хочется погорячее
wrapEach('.tabmenu .tab li a', 'div', 1, 'tab-inner');

https://javascript.ru/forum/dom-wind...tml#post533431
Ваш вариант работает. Спасибо, большое!
Ответить с цитированием
  #6 (permalink)  
Старый 17.02.2021, 13:25
Профессор
Отправить личное сообщение для Vaska Посмотреть профиль Найти все сообщения от Vaska
 
Регистрация: 08.05.2017
Сообщений: 178

voraa,
Ваш вариант не работает. Спасибо, что поучаствовали.
Ответить с цитированием
  #7 (permalink)  
Старый 17.02.2021, 13:37
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Сообщение от Vaska
Ваш вариант не работает
кавычки строка 3 пост #3
Ответить с цитированием
  #8 (permalink)  
Старый 17.02.2021, 13:54
Профессор
Отправить личное сообщение для Vaska Посмотреть профиль Найти все сообщения от Vaska
 
Регистрация: 08.05.2017
Сообщений: 178

Сообщение от рони Посмотреть сообщение
кавычки строка 3 пост #3
Да, если добавить кавычку, то работает.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Передача значения внутри тега <label> на сервер при помощи AJAX MaksimZykov AJAX и COMET 4 22.10.2018 09:51
Как посчитать теги "P" внутри в тега "DIV" OmarioNurm Общие вопросы Javascript 2 25.11.2016 14:00
Удалить всё внутри тега html и снаружи niko45 Общие вопросы Javascript 10 23.11.2014 10:32
поиск классов внутри тега yozuul jQuery 24 14.06.2013 22:00
Как гугл получает объект внутри тега <script>? zilker Events/DOM/Window 4 19.03.2013 17:19