urlによってhtmlを追記したい

html
1<ul>
2<li>
3<a href="https://aaaa.jp/aaaa/1">テキストテキスト<span class="add-icon">A追加</span></a>
4</li>
5<li>
6<a href="https://aaaa.jp/bbbb/2">テキストテキスト</a>
7</li>
8<li>
9<a href="https://aaaa.jp/cccc/1">テキストテキスト<span class="add-icon">C追加</span></a>
10</li>
11</ul>

<a href="">のリンクの中に指定するURL文字列がある場合、<a></a>で囲われた中の最後にA追加を追加したいです。

urlにaaaaが入っている場合はA追加
ccccが入っている場合はC追加
といったように出し分けも行いたいです。

urlは完全一致で大丈夫です。
方法お分かりの方ご教授ください。

kei344

2018/02/22 04:06

ご自身で試されたコードを質問文に追記し、「何」が「どのように」わからないのか、コードのどの部分で詰まっているのかなどを具体的に追記されたほうが回答が望めると思います。

行動規範の内容に同意します

回答2件

JavaScript
1document.addEventListener('DOMContentLoaded', function(event) {
2  let span = document.createElement('span');
3  span.className = 'add-icon';
4  document.querySelectorAll('a[href]').forEach((a, index) => {
5    switch (a.getAttribute('href')) {
6      case 'https://aaaa.jp/aaaa/1':
7        span.textContent = 'A追加';
8        a.appendChild(span.cloneNode(true));
9        break;
10      case 'https://aaaa.jp/cccc/1':
11        span.textContent = 'C追加';
12        a.appendChild(span.cloneNode(true));
13        break;
14      default:
15        break;
16    }
17  });
18}, false);

投稿2018/02/22 07:37

x_x

総合スコア13749

takesu

2018/02/27 21:47

お返事遅くなって申し訳ありません。やってみましたが、うまく動作しませんでした・・・ phpで調べてみようと思います。ありがとうございます。

行動規範の内容に同意します

javascript
1	$('a').each(function(){
2		
3		if($(this).attr('href').match("aaaaaaa") != null){
4			
5			var html = $(this).html();
6			html += '<span class="add-icon">A追加</span>';
7			$(this).html();
8			
9		}else if($(this).attr('href').match("ccccccc") != null){
10			
11			var html = $(this).html();
12			html += '<span class="add-icon">C追加</span>';
13			$(this).html();
14			
15		}
16	});