javascriptでページ内の外部リンクのみに[target=”_blank”]を追加する。
外部リンクを別タブで飛ばしたい
ブログ等の更新をしていて、どうにかしたいなぁと思ってた。
同じサイト内へのリンクは同じタブでの遷移でいいんですが、外部リンクは別タブで飛ばしてあげたい。
ただ毎回、aタグに[target=”_balnk”]を書き込むのは面倒。
[target=”_blank”]挿入条件
- リンクドメインが window.hostname とイコールではない
- ページ内リンク「href=”#****”」ではない
- target=”_blank” がついていない
に当てはまる場合は自動で「target=”_blank”」が書き込まれるようにコードぶち込みました!
自己責任でご自由にお使いください。
<script> // ページ内の全ての[target="_blank"]のついていない <a> タグ // @params none; // @response [terget='_blank']を追加したDOMの配列; var external_link__add_blank = function(){ var a_tags = document.querySelectorAll('a:not([target="_blank"])'), res = []; if(!a_tags.length) return; // a_tagsがマッチなし = end for(var i = 0; i < a_tags.length; i++ ){ if( a_tags[i].href.indexOf(window.location.host) !== -1 ) continue; if( a_tags[i].href.indexOf('#') === 1 ) continue; a_tags[i].setAttribute('target','_blank'); res.push(a_tags[i]) } return res; } // var a__add_blanks = external_link__add_blank(); console.log(a__add_blanks); document.addEventListener('DOMContentLoaded',external_link__add_blank,false); </script>