Как получить атрибут rel?

Question

[RushV]

Всем привет!
Есть ссылка:

<a href="http://192.168.0.020/frty/category/service/" rel="category tag"></a>

Как написать проверку если есть атрибут "rel="category tag" то меняем цвет ссылки?

Answer 1

[Александр Вульф]

a[rel="category tag"] {
  color: red;
}

Answer 2

[Andrew]

https://codepen.io/kickerock-the-decoder/pen/XoaVWO
без jQ

Comments

[RushV]

А можно написать код если есть этот атрибут rel="category tag" то удаляем тег "a" и добавляем класс например "active"?
Написал вот так не работает

document.querySelectorAll('a').forEach(function(el){
		if(el.getAttribute('rel')=='category tag')el.addClass('active');
	})

[Andrew]

RushV, в ванильном JS'е нет такого метода. класс добавляется так:

document.querySelectorAll('a').forEach(function(el){
    if(el.getAttribute('rel')=='category tag')el.classList.add('active');
  })

а удалить откуда вы хотите?

[RushV]

Andrew,
Вот структура:

<ul class="breadcrumb">
		<li><a href="">ГЛАВНАЯ</a></li>
                <li class="active"><a href="" rel="category tag">УСЛУГИ</a></li>
</ul>

Мне надо Что бы было вот так:

<ul class="breadcrumb">
		<li><a href="">ГЛАВНАЯ</a></li>
                <li class="active">УСЛУГИ</li>
</ul>

Вот что то написал не работает опыта мало:

$('.breadcrumb li:last').addClass("active");
	if($(".breadcrumb li:last").hasClass("active")){
		$(".breadcrumb li:last").remove("a");
	}

[Andrew]

RushV, вы хотите удалить весь элемент?
Опишите точно то, что вам нужно.
Типа такого:
1. Клик по ссылке [rel="category tag"]
2. Удаляем эту ссылку
3. Добавляем родителю этой ссылки класс active

$('.breadcrumb li').click(function (){
if($(this).find('a').attr('rel')=='category tag'){
$(this).find('a').remove();
$(this).addClass('active');
};
})

[RushV]

Andrew,
Вот код по умолчанию который есть:

<ul class="breadcrumb">
    <li><a href="">ГЛАВНАЯ</a></li>
    <li><a href="" rel="category tag">УСЛУГИ</a></li>
</ul>

Надо добавить к последней тегу <li> добавить "class="active"
И надо убрать ссылку "<a href="" rel="category tag"></a>" с последнего пункта li
Должен получится вот так:

<ul class="breadcrumb">
    <li><a href="">ГЛАВНАЯ</a></li>
    <li class="active">УСЛУГИ</li>
</ul>

[Andrew]

RushV,

$('.breadcrumb li').click(function (){
if($(this).find('a').attr('rel')=='category tag'){
$(this).find('a').remove();
$(this).addClass('active');
};
})

[RushV]

Andrew, А можно без клика сделать?