したい事
URLに特定の文字を足す
page-link01.htmlの末尾に、「#content」を追加したい
▼対象のソース(例)
<ul class="page-link">
<li><a href="page-link01.html">リンク01</a></li>
<li><a href="page-link02.html">リンク02</a></li>
<li><a href="page-link03.html">リンク03</a></li>
</ul>
方法
jQueryを使用
①対象を絞込む(.page-link要素内のa)
②eachに関数を渡す
③関数内のjQuery(this)で、対象オブジェクトを取得し、変数objに代入
④変数objに代入した対象オブジェクトのリンクURLを取得し、変数linkに代入
⑤attrでリンクURLを「変数linkで取得したリンクURLに#contentをプラスした文字列」に置き換える
<script>
jQuery(function(){
jQuery(".page-link a").each(function() {
var obj = jQuery(this);
var link = obj.attr("href");
obj.attr("href",link+"#content")
});
});
</script>
実行例
<ul class="page-link">
<li><a href="page-link01.html#content">リンク01</a></li>
<li><a href="page-link02.html#content">リンク02</a></li>
<li><a href="page-link03.html#content">リンク03</a></li>
</ul>
分からなかった事
ネットの記事を参考にしましたが下記が特に分からなかったので、別途調べて記事を書きます。
- eachに関数を渡すとは?
- jQuery(this)とは?
- attr()とは?