スタートページ>( Web教材主張歴史

Javascript

Javascript, Ajax, HTML5 などに関する個人的な関心分野のメモです。


はじめに

そのうち、必要に応じて開発したJavascriptの関数をまとめてjsライブラリにしました。
   <script src="www.kogures.com/hitoshi/javascript/mathlib.js"></script>    数学ライブラリ
   <script src="www.kogures.com/hitoshi/javascript/xycoordinate.js"></script> CANVASを仮想XY軸で使うライブラリ
あくまでも自分利用を意図したものですが、それをご理解の上で、ご自由にコピーしたり、外部jsとしてご利用してください。

一覧表

区分・フォルダ名 題名・内容
自作外部js
mathlib 数学ライブラリ(mathlib.js
xycoordinate CANVASの仮想XY軸(xycoordinate.js
Javascript-tips 各種Javascriptのテスト
hush-map 連想配列
reg-exp 正規表現の基礎
web-storage Web Storageにより、他のHTMLに情報を渡す。
get-elements getElementByIdやgetElementsByClassNameなどの使用例
toggle-display 表示・非表示のスクリプト
link scriptによるリンク
get-image 画像の読込表示、拡大
url-encode 日本語ファイルの取扱
get-form フォーム入力の取得(目次)
getform1 テキストボックスやラジオボタンなど多様な入力方式での値を取得
getform2 getform1で取得した値をリンク先HTMLにパラメタとして渡す
getform3 HTML5でのフォームの新機能
function-argument 関数への引数の受け渡し
variable-argument 引数個数の大小
array-argument 配列引数
named-argument 名前付引数
function-name 関数名の引数
math-expression 数式の文字列引数
link-para リンクでのパラメタの受け渡し
  外部ファイルの読込
gaibu-file-test 外部ファイルの読込での留意事項。相対指定、スタイル・スクリプトの反映
index-iframe iframeによる外部ファイルの読込
gaibu-file Ajaxによる外部ファイルの読込(目次)
index-ajax Ajax(XMLHttpRequest)による非同期読込の基礎
html-test 同上:相対指定等の注意事項
plain 配列データの読込み(プレーンテキスト)
json 配列データの読込み(JSONファイル)
xml 配列データの読込み(XMLファイル)
script 配列データの読込(スクリプトファイル)
prototype Prototype.js(Ajax.UpdaterとAjax.Request)
prototype Ajax.Updater/Ajax.Requestによる外部ファイルの読込
prototype/test 同上:相対指定等の注意事項
jquery jQuery
jquery jQueryの基礎(目次)
selector セレクタの指定方法
trigger jQuery関数の起動形式
include 実例:jQueryによる外部HTMLファイルの読込・表示
iframe 同上。iframeへの読込・表示、iframeの高さ自動設定
toggle 実例:toggleメソッド。表示・非表示
hover 実例:hoverメソッド。マウスのon/offによる操作
file-api File APIのテスト。ローカルファイルの読込み(目次)
file-list ファイルの属性の取得(ダイアログボックス、ドラッグ&ドロップによる指定)
directory ファイルの属性の取得(フォルダ指定、パスの表示)Chrone専用
file-reader ファイルの内容の取得(readAsText, readAsDataURL)
image-local ローカル画像ファイルのCANVASへの表示
google-maps Google Maps(目次)
static-maps Google Static Maps V2の実例と簡単な説明
google-maps Google Maps V3の基本
google-maps-kinou Google Maps V3の機能
google-maps-icon Google Maps V3:マーカーアイコンの変更
google-search Google Search(目次)
google-search-form FormによるGoogle検索窓の作成
custom-search-elements Custom Search Elementsの実例
custom-search-control Custom Search Element Controlの実例
exif exif(JPEG画像情報の取得と利用)(目次)
get-exif 画像URLを与えて緯度・経度、撮影日時を得る
filereader-exif-map 画像ファイルを指定し、その画像、地図情報を得る
canvas CANVASの基礎
index CANVASの基礎(目次)
kihon1 CANVASの基本(1)CANVASの概念とそのピクセル情報
kihon2 CANVASの基本(2)図形描画のための基本的な標準機能
image 画像ファイルのCANVASへの表示
image-local ローカル画像ファイルのCANVASへの表示
xycoordinate 仮想的なXY座標系の自作ライブラリ
paintarea xycoordinate.jsの一機能。凸領域の塗りつぶし
cordinate-trans xycoordinate.jsを用いた発展。座標変換・3次元座標
animation1 遅延効果表示:setInterval()/clearInterval()
animation2 遅延効果表示:同上。前の画像を消す
animation3 遅延効果表示:疑似 sleep() 機能
応用編
CANVASの利用
oekaki 数式でお絵かき(数式グラフ、フラクタル、その他のまとめ)
graph 数式グラフ(陽関数、陰関数、媒介関数などのグラフ)
fractale フラクタル(マンデルブロー集合、ジュリア集合などの画像)
canvas-moire モアレ模様
canvs-etc その他(乱数、物理など)
image-process 画像処理(画素色変換、フィルタなど)
tipsの組み合わせ
imgfile-search 一覧表ファイルによる画像ファイルの検索