今回はLocationオブジェクトのプロパティを指定でURLの色々な情報が取得できるので解説します。
それではいってみましょう！
Menu
Locationとは
オブジェクトの場所 (URL) を表します。
Locationプロパティ
今回はURLが下記の場合の参考例を解説します。
1 | https://dailyrecords.blog:8080/wp-admin/post.php?post=13764&action=edit&q=serch#test |
Location.href
【結果】https://dailyrecords.blog:8080/wp-admin/post.php?post=13764&action=edit&q=serch#test
Location.protocol
【結果】https:
Location.pathname
【結果】/wp-admin/post.php
Location.host
【結果】:dailyrecords.blog:8080
Location.hostname
【結果】:dailyrecords.blog
Location.port
【結果】:8080
Location.search
【結果】?post=13764&action=edit&q=serch
Location.hash
【結果】#test
Location.origin
【結果】:https://dailyrecords.blog:8080
【応用】URLに指定文字が含まれていたら検索
サンプルURL
1 | http://localhost/DailyRecord/JQuery/URL.php |
Location.hrefを使用して、JQueryが含まれていたらの検索例
1 2 3 4 5 6 7 8 | //URLに指定した文字が含まれていたらの検索方法 $(window).on('load', function() { if (location.href.match('JQuery')) { console.log("OK"); } else { console.log("NG"); }; }); |
【結果】
JQueryという文字が含まれているので結果はOKです。
OK
まとめ
私も当ブログで使用してますが、指定したページだけ処理をする場合、非常に便利です。
以上です。
