質問: url + getDir(local); // 現在のディレクトリ console.log(pwd); ``` 以上のコードをindex.htmlでコンソールログを確認すると file:///Users/ユーザー名/Desktop/home/ となり。 この処理のあと、img/bb.jpgを連結する処理を入れて file:///Users/ユーザー名/Desktop/home/img/bb.jpg としてsrcタグに代入しております。 そして悩んでいるのは、 category/contact.html上で上の絶対パスを確認したところ file:///Users/ユーザー名/Desktop/home/category/img/bb.jpg となりcategory/配下にはimgフォルダがないのでエラーとしてなってしまいます。 file:///Users/ユーザー名/Desktop/home/imgを指定する方法はありますか? file:///Users/ユーザー名/Desktop/homeはサーバー等の兼ね合いもあり、 動的に変化させたいと思っております。
回答: ### 絶対パスと絶対URI 質問にある「絶対パス」は実のところは絶対パスではなく、「絶対URI」が正しい表現と思われます。 * HTML - パスの呼び方について(17299)|teratail ### カレントディレクトリを得る * window.location - Web API インターフェイス | MDN ``` console.log(location.protocol + '//' + location.host + location.pathname); ``` ### 相対パスを絶対URIに変換する `HTMLAnchorElement#href` は絶対URIを返します(`HTMLImageElement#src` も同様)。 * HTMLAnchorElement - Web API インターフェイス | MDN ``` var a = document.createElement('a'); a.href = 'foo.jpg'; // HTMLAnchorElement#href console.log(a.href); var img = new Image; img.src = 'foo.jpg'; // HTMLImageElement#src console.log(img.src); ``` `URL` コンストラクタは `window.location` と似た Interface を持ちます。 * URL() - Web API インターフェイス | MDN ``` console.log(new URL('foo.jpg', location.protocol + '//' + location.host + location.pathname).href); ``` Re: ishipp さん