Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 10.03.2018, 12:58
Аспирант
Отправить личное сообщение для Ленча Посмотреть профиль Найти все сообщения от Ленча
 
Регистрация: 13.07.2014
Сообщений: 78

Выделение элемента по отсутствию тегов
Бэкендщики не всегда представляют на каком моменте верстальщик схватится за голову и заплачет в голос. И нужные теги не факт, что будут изначально выведены при формировании страницы. А хакать ядро, имхо, дурной тон.

Имеем в общем контейнере несколько штук вот таких зверей

<span class="input_type_radio">
	<input type="radio" name="jshop_attr_id[2]" id="jshop_attr_id26" value="6" onclick="setAttrValue('2', this.value);"> 
	<label for="jshop_attr_id26">
		<span class="radio_attr_label">
			<img src="http://mike.zakaz-saita.com/components/com_jshopping/files/img_attributes/21.jpg" alt=""> 
			Голубой с перекладинами
		</span>
	</label>
</span>

И вот это вот Голубой с перекладинами нужно выделить спаном. Как?? Как сказать скрипту - выделяй то, не знаю чего..

Последний раз редактировалось Ленча, 10.03.2018 в 13:01.
Ответить с цитированием
  #2 (permalink)  
Старый 10.03.2018, 14:20
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

wrap текст в конце блока
Ленча,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  .input_type_radio .radio_attr_label span{
    background-image: -webkit-gradient(linear, left, right, color-stop(0, #FF00FF), color-stop(1, #0060BF));
    background-image: -o-linear-gradient(left, #FF00FF, #0060BF);
    background-image: -moz-linear-gradient(left, #FF00FF, #0060BF);
    background-image: -webkit-linear-gradient(left, #FF00FF, #0060BF);
    background-image: linear-gradient(to right, #FF00FF, #0060BF);
    color: #FFFFFF;
     margin: 10px;
  }
  .input_type_radio .radio_attr_label img{
    height: 15px;
    width: 15px;
  }

  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script>
$(function() {
  $(".input_type_radio .radio_attr_label").each(function(indx, el){
        $(el.lastChild).wrap("<span/>")
        });
});
  </script>
</head>

<body>
<span class="input_type_radio">
  <input type="radio" name="jshop_attr_id[2]" id="jshop_attr_id26" value="6" onclick="setAttrValue('2', this.value);">
  <label for="jshop_attr_id26">
    <span class="radio_attr_label">
      <img src="http://mike.zakaz-saita.com/components/com_jshopping/files/img_attributes/21.jpg" alt="">
      Голубой с перекладинами
    </span>
  </label>
</span>
<span class="input_type_radio">
  <input type="radio" name="jshop_attr_id[2]" id="jshop_attr_id26" value="6" onclick="setAttrValue('2', this.value);">
  <label for="jshop_attr_id26">
    <span class="radio_attr_label">
      <img src="http://mike.zakaz-saita.com/components/com_jshopping/files/img_attributes/21.jpg" alt="">
      Голубой с перекладинами
    </span>
  </label>
</span>
<span class="input_type_radio">
  <input type="radio" name="jshop_attr_id[2]" id="jshop_attr_id26" value="6" onclick="setAttrValue('2', this.value);">
  <label for="jshop_attr_id26">
    <span class="radio_attr_label">
      <img src="http://mike.zakaz-saita.com/components/com_jshopping/files/img_attributes/21.jpg" alt="">
      Голубой с перекладинами
    </span>
  </label>
</span>

</body>
</html>

Последний раз редактировалось рони, 10.03.2018 в 14:32.
Ответить с цитированием
  #3 (permalink)  
Старый 10.03.2018, 15:43
Аспирант
Отправить личное сообщение для Ленча Посмотреть профиль Найти все сообщения от Ленча
 
Регистрация: 13.07.2014
Сообщений: 78

Спасибо, Профессор!

el.lastChild мне даже в голову не пришло - почему-то не воспринимался этот текст как элемент.

Жаль, не могу карму плюсануть(
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Изменить класс родительского элемента STyLe Общие вопросы Javascript 1 29.05.2014 20:21
Замена DOM элемента другим элементом MaxXxaM Events/DOM/Window 5 04.05.2013 01:24
DOM модель подсчет тегов документа kent666 Events/DOM/Window 4 17.10.2011 21:51
Выделение текста, передвижение элемента (Sandr) Общие вопросы Javascript 5 06.01.2011 12:47
Выделение одиночных тэгов Pattern Events/DOM/Window 7 26.05.2009 23:29