Применить атрибут при загрузке DOM

140
23 ноября 2018, 17:00

Имеется <div> с множеством разных ссылок <a>

Как методами JS применить ко всем ссылкам в контейнере атрибут target="_blank"

Идентификатор контейнера id="footer"

Answer 1

Немного не успел, но всё же ;)

[...footer.getElementsByTagName('a')].forEach(e=>{ 
  e.setAttribute('_target', 'blank'); 
  console.log(e); 
});
<div id="footer"> 
  <a href="#">Link</a> 
  <a href="#">Link</a> 
  <a href="#">Link</a> 
</div>

P.S. footer.getElementsByTagName('a') - вернёт HTMLCollection. На англоязычном SO написано как работать с таким типом.

Answer 2

Если jquery:

$('#footer a').attr('target', '_blank');

Без jquery:

const children = document.querySelectorAll('#footer a') 
 
for(let e of children){ 
 e.setAttribute('target', '_blank'); 
 console.log(e) // чтобы показать результат 
}
<div id="footer"> 
 <a href="/1">1</a> 
 <a href="/2">2</a> 
 <a href="/3">3</a> 
</div>

READ ALSO
Как избежать дублирования методов в Nuxt.js

Как избежать дублирования методов в Nuxt.js

Всем приветРаботая над одним проектом(сам новичок) столкнулся со следующей дилеммой:

146
Gulp и API prettier

Gulp и API prettier

Как мне прогнать файл styles/stylecss через через галп, с помощью prettier ?

141
Axios выполняет два запроса по post

Axios выполняет два запроса по post

Доброго времени суток есть скрипт, который постит новость в базу, к нему при помощи AXIOS пробрасываются данные

124
Как менять текст ссылки если блоки работают как &#171;аккордеон&#187;?

Как менять текст ссылки если блоки работают как «аккордеон»?

Есть форма с даннымиПри клике на ссылку, раскрывается дополнительный блок под ним

153