こんにちは、hideです。 近年のAjax技術の台頭により、Web2.0時代のエンジニアにとってJavaScriptは欠かすことのできない技術となってきました。しかし、2000年頃のWeb1.0時代には低機能な言語として認知されていました。このことは、"Rediscover the JavaScript"と題された次の文章に良く表れていると思います。 10 年。世界が JavaScript の真の実力を発見するのに要した時間である。 1995 年、Netscape 社の Brendan Eich により開発・設計された JavaScript は、「世界で最も誤解されたプログラミング言語」などと呼ばれもした、ともすれば不遇とすらいい得る歳月を経て、あたりのそこここに満ち充ちていた「Web の旧来的なインタラクションの窮屈さを革命したい」という思いによって、ふたたび表舞台に招来された。(S
Keitaです。 Ajaxが流行していますが、まだ、僕個人では実装レベルまでライブラリの蓄積が追いついていません。 各種ライブラリがWebフレームワークレベルでそろったら(そろえたら)使いたいなと思っていますが、なかなかそこまで手が出てないのが現状です。 とはいえ、社内でもDojoや、MochiKitなどのフレームワークがはやりつつあるので、そろそろつかいたいかなーと思いセキュリティを含めたリスクを調査しています。 とはいえ、まだまだ勉強中の身であるので、突っ込みいただけると助かります。 (1) クロスサイトスクリプティングに注意する 基本的な対策は、サーバサイドのときと同じく、描画を行うタイミングでエスケープ処理を行うことになります。 だだし、HTTPヘッダではなくBodyにエスケープしてない文字列をおいた場合にはAjaxではなく直接アクセスすると、XSSになる場合があるので注意が必
http://www.goodpic.com/mt/archives2/2006/02/ajax.html で紹介されてる通り、script.aculo.usは通常のロードではファイルサイズが100KBを超えます。しかし、それはフルでロードしたときの容量なのです。script.aculo.usはロードするパッケージを選ぶことができる*1ので必要な機能だけを選べば良いのです。例えば、たいていの場合はscript.aculo.usのeffects.jsだけしか使わなかったりするので <script src="/js/scriptaculous.js?load=effects" type="text/javascript"></script> とすればOK。これでファイルサイズは34KBに収まります。また、二つ以上のパッケージを選択したい場合は <script src="/js/scriptac
サイト更新情報 2006/12/06 よく使われているページを検索窓から簡単に辿れるようにしました。(検索窓に「prototype」と入力) 2006/11/27 JavaScript入門/応用サイトJavaScriptistオープン! 2006/11/23 試して確認できるJavaScriptオンラインエディタを公開 2006/11/20 JavaScriptリファレンス、逆引きサンプル集を公開 2006/11/19 JavaScriptライブラリ活用ページ公開 2006/11/15 JavaScriptistベース機能の構築完了 過去のサイト更新情報
Jack Slocum's Blog Resizable Reloaded - A reusable component for resizing elements This is a basic as you get. To resize the box, position your mouse anywhere near the bottom, right or bottom right edge of the box. This example uses the default "floating" handles. リサイズ可能なブロック要素をページに作る為のJavaScript コンポーネント。 次のように、ブロック要素にリサイズハンドルを付けることができ、画像をその場でリサイズできます。 小さい画像を置いておいて、利用者が自由にリサイズするようなUIが実現出来ます。 Yahoo
こんにちは、さかとくです。今日は、世界中のプログラマーを悩ませているバグを退治する方法について考えてみたいと思います。今回は、特に、JavaScriptのバグを退治する方法にスポットを当ててみたいと思います。 そもそも、バグ(Bug)とは、正しくプログラムが動かない状態、不具合のある状態です。 書き間違いや、なんらかの勘違いが原因であることが多いです。簡単なつづりミスならば、構文エラー(Syntax Error)によって、すぐに間違いが見つかります。しかし、簡単にバグの原因が特定できないことも多くあります。そんなときはどうしたら良いでしょうか? 以下の3点から考えてみます。 ・具体的なデバッグ方法 ・バグを予防する ・精神論 具体的なデバッグの方法 どんな天才的なプログラマーでも、間違いの1つや2つは犯してしまうものです。一度もバグに遭遇せずプログラムを完成させることはできません。「
Ajaxライブラリの全体像を把握しよう Ajaxライブラリ(*注1)はすでに数多くのものが出回っていますが、多過ぎて全体像がつかめていないのではないでしょうか。今回は代表的なAjaxライブラリの一部を挙げ、それぞれを比較しながらAjaxライブラリの全体像を把握していきたいと思います。 どうして、Webアプリ開発にAjaxライブラリが必要なのか どのようなプログラミング言語でもライブラリが存在するように、Ajaxにおいてもライブラリが存在します。 初めにAjaxライブラリの必要性について見ていきたいと思いますが、ここではAjax開発ならではのライブラリの必要性を2点取り上げます(ほかの言語のライブラリと共通する必要性はあらためて取り上げません)。 クロスブラウザ対応 Ajaxの利点として、さまざまな環境における一般的なWebブラウザ上で実行できることが挙げられます。しかしWebブラウザの実装
2006-11-20T14:20:42+09:00 追記 「何者か」に攻撃を受けて、このページの内容が差し変わっていました。あわててバックアップファイルから復旧しました(「何者か」 = 酒……)。 prototype.jsを10KBにする方法の続き(.htaccessをスマートに使う) : 亜細亜ノ蛾 に続きを書きました。合わせてどうぞ。 JavaScript ファイルを圧縮する 正真正銘、Prototype(“prototype-1.4.0.js”)を10キロバイト(10,453 bytes)に圧縮して、しかも(当たり前ながら)動作するようにする方法です。 ──と聞いて真っ先に思い浮かぶのが「各種JavaScriptファイル圧縮サービス」、という人も多いでしょう。 しかし、自分が試してみたところ、例えば/packer/で圧縮したJavaScriptファイルは上手く動作しませんでした(他は
独自デザインのSelectボックスを作成するJavaScriptライブラリ「Custom SelectBox」 2006年11月16日- Custom SelectBox (WebFX) This sample creates a selectbox that works almost identically to the 独自デザインのSelectボックスを作成するJavaScriptライブラリ「Custom SelectBox」。 <option> の中身にHTMLタグを指定することが出来るようです。 次のようなコードでこれが実現できます。 <html> <head> <link type="text/css" rel="STYLESHEET" href="classic.css"> <script type="text/javascript" src="fade.js"></scri
Mini AjaxはAjaxライブラリの1つです。Mini Ajaxは非同期通信機能に特化した非常にコンパクトなライブラリです。Mini Ajaxにはバージョンがありませんが、都合によりここではversion 1.0としています。 version 1.0 リファレンス
こんにちは。できないのではなく「つくらない派」のhideです。 以前、「Dojoで簡単にクロスドメインAjaxを実現」というエントリを書きましたが、その後、新機能が追加されたDojo 0.4がリリースされました。0.4になって、JSONPを簡単に扱う方法は、dojo.io.bind() を dojo.io.ScriptSrcTransport.bind() を使うように変更しないと動作しなくなったので注意してください。 追加された機能は次の通りです。 ・グラフ描画機能の追加 ・各種ウィジェットの追加 ・SVG/VMLのベクター描画ライブラリ(GFX)の追加 ・FireBugと連携したデバック機能の改善 ・名前空間のサポート ・i18nサポート そして、Dojo 0.4を使っていろいろ遊んでみたサンプルがこれです。HTMLとJavaScriptのコードを書いただけで、サーバサイドの
選択中のINPUT要素をハイライトしてくれるJavascriptライブラリ「Highlight active input」 2006年11月09日- Highlight active input This script is easy to configure. All you have to do is to define how the active input should be highlighted. This is done by CSS. Then you have to call a function at the bottom of your page to initialize the script. 選択中のINPUT要素をハイライトしてくれるJavascriptライブラリ「Highlight active input」。 実装方法は簡単で、次の通り。 1. CSSの
dojo, the Javascript Toolkit: brought to you by the Dojo Foundation グラフ描画機能が機能追加されたJavaScriptライブラリ「Dojo 0.4」。 次のようなグラフがJavaScriptで描画することが可能です。曲線も美しいですね。一見Flashを使っているようにも見えます。 グラフ描画するためには、dojo.jsを読み込んで、次のようなコードを書きます。 dojo.require("dojo.collections.Store"); dojo.require("dojo.charting.Chart"); dojo.require('dojo.json'); // our sample data for our line chart. var json = [ { x: 0, y: 110, size:20, x2:
■ JavaScript ミニライブラリ ちょっと前から「なくても不便じゃないけど、あったらちょっと便利かもね」っていう JavaScript を書いたりして発表していましたが、一覧とか作ってないからどんなのがあるのかわかりにくかったのでまとめてみました。 onsubmit で disable 以外のスクリプトは全てパブリックドメインとするので、自由に使って下さい。onsubmit のやつはもともと自分が作ったものじゃないので良くわかんない(← 無責任)。 結構作ってるつもりだったけど、並べてみると意外と少ない。 onsubmit で disable にするやつ テキストフィールドのフォーカス時に背景色を変更する JavaScript フォームに入力を促すメッセージを出力する JavaScript パスワードの安全性を教えてくれる JavaScript カーソル位置のセルの上端と横端をハイ
ここではあまりプログラミングの話はしないのですが(私も今気がついた), たまにはいいでしょう。 今回は JSON というデータフォーマットのお話です。 めっさ長文です。 ご注意を。 (3/8 追記があります) 最近 JSON (JavaScript Object Notation)にハマってます。 JSON というのはごく軽量のデータフォーマットで, Javascript (というより ECMAScript と言うべきかもしれませんが)の言語仕様がベースになっています。 とはいえ, JSON 自体は Javascript からは独立していますので他の言語(C/C++, Java, C#, Perl, Ruby, Python など)でも問題なく扱うことができます。 JSON は以下の2種類のデータ構造の組み合わせでできています。 (JSON フォーマットの詳しい解説をご所望の方は「入門 J
Crescent Eve はシンプルなエディタです。 こだわりの基本機能とHTML編集機能を持っています。 【雑談】 ある日のふとした疑問 ~ HTMLを書く道具 ~ ある日、メモ帳等のテキストエディタでHTML書いている人が意外に多いことに気がつきました。 「多機能で優秀なHTMLエディタは沢山あるのに、なぜかな」 「もしかして、軽くてシンプルなSDI形式のHTMLエディタが求められているのだろうか」 「よし、作ってみよう!」 「あくまでシンプルに、テキストエディタとしても使えるようにして、タグはキーボードから自然に入力補完できるようにしよう」 「手作業でタグを打ち込んだら間違いが出るから、文法チェック機能をつけよう」 「文字コードの自動認識は、絶対失敗しないようにしよう」 ・・・というような考えから Crescent Eveを開発することにしました。 その後 公開以来、多くの方に好評を
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く