一問一答コーディング問題「相対パス」【基礎演習】

こんにちは、@codeship_techです。

今回の授業日記は一問一答コーディング問題です。

難易度は比較的低めで、プログラミング学習では必須の相対パスについての問題です。

ぜひ今の理解度を確かめてみてください!

前回の問題はこちら↓

https://code-ship-blog.wemotion.co.jp/class-diary/%e4%b8%80%e5%95%8f%e4%b8%80%e7%ad%94%e3%82%b3%e3%83%bc%e3%83%87%e3%82%a3%e3%83%b3%e3%82%b0%e5%95%8f%e9%a1%8c%e3%80%8cjquery%e3%82%92javascript%e3%81%a7%e7%bd%ae%e3%81%8d%e6%8f%9b%e3%81%88%e3%81%a6/

次のようなファイル階層の中で、あるファイルからあるファイルを参照するときの相対パスを記述してください。
なお、名前が /で終わるものはフォルダとし、それ以外はファイルとします。
(難易度:★★☆☆☆)

my-workspace/
index.html
pages/
about.html
member.html
src/
server.js
utils/
clock.js
pageManager.js
style/
style.css
about.css
member.css
images/
imageA.jpg
imageB.jpg
imageC.jpg

例:index.htmlからstyle.css
解答例: ./style/style.css

  1. member.htmlからindex.html
  2. style.cssからimageA.jpg
  3. about.htmlからpageManager.js























正解

  1. ../index.html
  2. ../images/imageA.jpg
  3. ../src/utils/pageManager.js

ポイントは「一つ上のディレクトリ」を意味する特殊パス .. です。
相対パス指定に慣れないとスムーズな開発は困難ですので、抑えておきましょう。

他の一問一答コーディング問題はこちら

https://code-ship-blog.wemotion.co.jp/class-diary/%e3%80%90%e4%bb%8a%e6%97%a5%e3%81%aeqa%e3%80%91%e4%b8%80%e5%95%8f%e4%b8%80%e7%ad%94%e3%82%b3%e3%83%bc%e3%83%87%e3%82%a3%e3%83%b3%e3%82%b0%e5%95%8f%e9%a1%8c%e3%80%90javascript%e3%80%91/
https://code-ship-blog.wemotion.co.jp/class-diary/%e3%80%90%e4%bb%8a%e6%97%a5%e3%81%aeqa%e3%80%91%e4%b8%80%e5%95%8f%e4%b8%80%e7%ad%94%e3%82%b3%e3%83%bc%e3%83%87%e3%82%a3%e3%83%b3%e3%82%b0%e5%95%8f%e9%a1%8c%e3%80%90javascript%e3%80%91-2/
https://code-ship-blog.wemotion.co.jp/class-diary/%e3%80%90%e4%bb%8a%e6%97%a5%e3%81%aeqa%e3%80%91%e4%b8%80%e5%95%8f%e4%b8%80%e7%ad%94%e3%82%b3%e3%83%bc%e3%83%87%e3%82%a3%e3%83%b3%e3%82%b0%e5%95%8f%e9%a1%8c%e3%80%8cswitch-case%e6%96%87%e3%80%8d/
https://code-ship-blog.wemotion.co.jp/class-diary/%e4%b8%80%e5%95%8f%e4%b8%80%e7%ad%94%e3%82%b3%e3%83%bc%e3%83%87%e3%82%a3%e3%83%b3%e3%82%b0%e5%95%8f%e9%a1%8c%e3%80%8cjquery%e3%82%92javascript%e3%81%a7%e7%bd%ae%e3%81%8d%e6%8f%9b%e3%81%88%e3%81%a6/

授業日記についてのご意見

CodeShipの授業について「こんな事が知りたい・紹介して」というご意見・ご提案がありましたら、CodeShip公式Twitterアカウント(【CodeShip】プログラミングスクール)までDMまたはリプライにてお寄せください。パネル