画像の操作:

画像のディレクトリパスとファイル名を取得

<img>Nodeを渡して、srcに設定されている画像のディレクトリまでのパス、ファイル名、拡張子、クエリを配列で返す。

Node
<img>Nodeを渡す id値を文字列で指定してもよい
●必須引数 ●オプション引数(省略可能)

記述例

$imgSrc($id('photo1'))
$imgSrc('photo1')

戻り値

解析した情報を格納した配列を返す。

配列[0]:ディレクトリまでのパス

配列[1]:画像のファイル名

配列[2]:拡張子 ※ピリオド無し

配列[3]:クエリ ※設定されていなければ null

動作サンプル

HTML : <div id="sample1"> <img src="../images/cmn_pht_1.jpg" height="200" alt=""> </div>
Javascript : var data1=$imgSrc($tag('img','sample1',0))[0]; var data2=$imgSrc($tag('img','sample1',0))[1]; var data3=$imgSrc($tag('img','sample1',0))[2]; var data4=$imgSrc($tag('img','sample1',0))[3]; //クエリは設定されていない
HTML : <div id="sample2"> <img src="../images/cmn_pht_5.png?ver=06223" height="200" alt=""> </div>
Javascript : var data1=$imgSrc($tag('img','sample2',0))[0]; var data2=$imgSrc($tag('img','sample2',0))[1]; var data3=$imgSrc($tag('img','sample2',0))[2]; var data4=$imgSrc($tag('img','sample2',0))[3];
※上記のサンプルコードは主にPC表示用を想定している。スマホ用のコーディングでは別途調整が必要となる可能性がある。
※この関数の動作サンプルとして必須ではない装飾的なCSSコードなどは省略して提示している。