株式会社オートプロジェクト

javaScriptプログラム開発

js javaScript・jQueryプログラムを開発します

javaScriptは、ブラウザを操作するためのプログラムで、例えば、ブラウザウィンドウを閉じたり、別ページに遷移させることが可能です。jQueryは、javaScriptのプログラムの一つで、CSSの操作をすることで、デザインに変化を与えることが可能です。

javaSctiptやjQueryを使用することで、静的HTMLページにも動きを与えることが可能です。例えば、下記のサイト。

http://www.imcshop.com/

このページでは、左メニューにjQueryを使用することで、「レクサス」というメニューをクリックすると、そのメニューが開閉する仕組みを取り入れています。

 

javaScriptプログラム 開発事例

・閲覧履歴の表示

カーパーツ通信販売サイト  http://www.imcshop.com/ にて、商品閲覧履歴を表示させています。下記画像の赤枠の箇所。

eb44f407c9aac93c419cff2219383d4483d3837260f868272045155e87f566e9_171016_500

これは大きなシステムは必要なく、簡単なjavaSciprtプログラムで実装が可能です。

・オススメ商品表示システム

カーパーツ通信販売サイト  http://www.imcshop.com/ にて、商品ページごとに、その商品を見たユーザーに対して、オススメ商品を表示します。下記画像の赤枠の箇所

origin

このシステムの実装には、javaScript以外にも、データベースの構築や、商品を表示させるためのロジックが必要となります。表示等にjavaScriptを使用することで、表示の実現を行います。

・価格一覧表示

例えば、下記ページでは、

http://www.imcshop.com/prius/aero.htm

表示価格をAjaxという機能を用いて表示させています。このページ自体には、価格の表記は無く、価格部分は空となっています。データベースから価格データを読み取り、価格を表示させる仕組みとなっています。

このメリットは、例えば、消費税のアップなどで価格の更新がまとめて必要になった時などに、価格データーベースをまとめて更新するだけで、価格の更新作業が終わることです。HTMLファイルに価格を直接記述する場合は、該当する全ページに対して作業が必要になりますが、システム化することで、その作業が10分程度で完了することも可能です。

javaScriptに関する技術Tips

JSONファイルを$.ajax で読み込む

ある文字数を超えたら「….」のように表示させる