読者です 読者をやめる 読者になる 読者になる

外部css,jsを読み込む時にスキームを省略すると現在のスキームを使用してくれる

CSS Javascript

jQueryやbootstrapを使うときCDNにあるものを使うことがほとんどだと思うけど下記のように書くことが多かった。

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>  

最近はスキームを省略するのが流行りなのね?と糞みたいな理解をしていたので今回ハマった。
スキームを省略すると現在のスキームを利用するという仕様の為、HTTPとHTTPSの切り替えをしなくても良い利点があるからこういう記述をするらしい。

今回ハマったのは、静的なHTMLをローカル環境で作成していた時。
bxSliderを利用したいと思い上記のようなjQueryを読み込むコードを書いてからbxSliderのJSを読み込んだ。

今にして思えば当然なのだが、コンソールには「jQuery is not defined」という文字。
最初にjQueryの読み込みより前に記述していないかという点だったが、複雑なファイル構成ならまだしもただjQueryと読み込んでbxSliderを読み込んでいるだけなのだから間違えるはずがない。

そのまま悩んでいたのだが、改めてGoogle Developersからコピーしてくると動いた。

違いはなんだと比べるとhttpsの有無。ということで原因が判明した。

fileスキームでHTMLファイルを開いてコーディングしていたので、ローカルパスにjquery.min.jsを探しに行っていたから読み込めずエラーを吐いていたというわけだった。ださい。