サクサク読めて、アプリ限定の機能も多数！
トップへ戻る
WWDC25
ajax.studynet.jp
Ajax入門|Ajaxの基礎と応用の学習 Ajax入門 Web2.0を代表する技術であるAjax JavaScriptの基本からAjaxの基礎・応用までサンプルを使って紹介
Ajax入門|Ajaxの基礎と応用の学習 Ajax入門 Web2.0を代表する技術であるAjax JavaScriptの基本からAjaxの基礎・応用までサンプルを使って紹介 ready()は、DOMツリーが構築されたら、即関数を実行するjQueryのメソッドです。ready()メソッドは、HTML読み込み後にDOMツリーが構築されたのを検出して、JavaScriptを実行させます。DOMツリーが構築されるタイミングは、ブラウザによって異なってくるので、クロスブラウザ対策が必要ですが、jQueryは、ブラウザの違いを吸収し、簡単に表記できるようにしています。 ページが読み込まれたのを検出するには、loadイベントを通常使うのですが、この場合、DOM構築後、画像などの読み込みが完了しないと、loadイベントが発生しないので、重い画像が有る場合には、JavaScriptの実行が遅れてします。こう
Lightbox 2.0のサンプルを紹介します。 Lightbox2.0のインストール方法を参考にして、JavaScriptファイルとcssファイルを用意してください。小さな画像と大きな画像のセットを用意したら、以下のように<a>タグで書けば簡単にLightbox2.0を実装することができます。 [実行サンプル] Lightbox2.0のサンプル HTML <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Script-Type" content=
dom:loadedは、prototype.jsの拡張イベントです。通常ページを読み込まれた後にJavaScriptを実行するには、loadイベントを使いますが、サイズの大きい画像ファイルなどが存在すると、loadイベントが発生するまで時間がかかります。この場合、dom:loadedイベントを利用すると、ユーザビリティが向上します。ただし、ブラウザの仕様によって動作のタイミングは違います。
Ajax入門|Ajaxの基礎と応用の学習 Ajax入門 Web2.0を代表する技術であるAjax JavaScriptの基本からAjaxの基礎・応用までサンプルを使って紹介 jQueryとprototype.jsを使った場合のDOM書き換えサンプルを紹介します。 Ajaxフレームワークの代表であるjQueryとprototype.jsを使った場合の記述方法の違いが分かるように纏めました。単純なDOMの書き換えプログラムを紹介しますが、同時にloadイベントとclickイベント処理方法も参考にしてください。jQueryでは、明示的にloadという言葉を記述しませんが、HTML読み込み後DOMが構築されるとすぐに実行させたい場合は、「$(function(){//ここに処理を記述;})」の形式でプログラムを書きます。DOM構築のタイミングはブラウザによって異なるのでクロスブラウザ対策が必要です
jQuery.noConflict()は、jQueryとprototype.jsを共存させるために宣言するメソッドです。 jQueryには、$()関数がありますが、prototype.jsにも同じ関数が存在しています。そこで、二つのライブラリーを共存させる為には、jQuery.noConflict()を最初に宣言します。この場合、jQueryの$()関数は、jQuery()で記述するようにします。 [サンプル] jQueryとprototype.jsの共存の例 HTML
正規表現の基礎 正規表現とは、文字列のパターンを特殊な記号で表現したものです。 文字列の中に特定のパターンの文字列があるかどうか検索したり、文字列が特定の フォーマットに合致しているかどうかを調べるとき使います。 » 正規表現に関する詳細はこちら JavaScriptの記入方法 JavaScriptを記述するときは、HTML内部に記述する場合と外部ファイルから 読み込む場合の２通りがあります。一般的には、外部ファイルから読み込んだ方が SEO対策の為に良いとされています。さらに、外部ファイル化することによって デザインとプログラムを分離して管理できるようになります。 » JavaScript記入方法に関する詳細はこちら JavaScriptとは JavaScriptとは、Webページを動的に制御することができるスクリプト言語です。JavaScriptは、ブラウザ側で実行される為に、クライア
Ajax入門|Ajaxの基礎と応用の学習 Ajax入門 Web2.0を代表する技術であるAjax JavaScriptの基本からAjaxの基礎・応用までサンプルを使って紹介 イベントハンドラ一覧 onabort(中止) onblur(フォーカス外) onchange(変更) onclick(クリック) onclose(閉じた時) ondblclick(ダブルクリックした時) ondragdrop(ドラッグ＆ドロップ) onerror(エラー) onfocus(フォーカス) onkeydown(キーを押した時) onkeypress(キーを押し続けた時) onkeyup(キーから離れた時) onload(ロードした時) onmousedown(マウスボタンを押した時) onmousemove(マウスカーソルを移動した時) onmouseout< (マウスカーソルが離れた時) onmouseo
Ajax入門|Ajaxの基礎と応用の学習 Ajax入門 Web2.0を代表する技術であるAjax JavaScriptの基本からAjaxの基礎・応用までサンプルを使って紹介 Ajax（エイジャックス）の基本は、JavaScriptのプログラミングとJavaScript/Ajaxライブラリの活用です。広範囲なAjax技術の中から、特に入門者向けの記事を中心として 役に立つ情報を配信中。prototype.jsやjQueryなどのAjaxライブラリーを使ったサンプルも紹介しています。 Ajaxの基礎であるJavaScriptの基本を学ぶ為に、入門者向けの「やりなおしのJavaScript」を連載（ThinkITに掲載)。 「やりなおしのJavaScript」では、毎回小さなアプリケーションを作りながら、DOMの制御方法や、Ajax/JavaScriptの基礎文法の復習をしていきます。Think
このページを最初にブックマークしてみませんか？
『Ajax入門|Ajaxの基礎と応用の学習|StudyNet』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
