正規表現テスト君 ver 0.9.7 2018-08-30 XHTML から HTML5 風に書き換える 2008-06-01 入力欄の自動可変。ちょっとバグ取り 2008-05-18 複数行も入力可に、位置マッチも表示 2008-05-01 テスト対象を追加できるように改造 2008-05-01 デザインちょっと変更 2008-04-29 改行表示対応 2008-04-24 とりあえず公開
IE8の挙動について追記しました。 IE8は、img.complete は 画像読み込みでも true になりません(falseのままです)。 そのかわり、img.readyState が "complete" になります。 JavaScriptでの画像の動的/遅延読み込みといえば (new Image).src = URL; なんですが、 タイムアウトやエラーの状況を把握したい時もあったりします。GoogleMapライクなアプリを作ってるときとか。 今回ちょっと必要になったのでまずは調査から。 以下のコードで、存在しないファイル(missing.jpg)を読み込ませ、実行経路を確認してみます。 <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://w
Greasemonkey のユーザスクリプトなどの JavaScript ソースコード内に画像データを埋め込める、 『data:image/gif;base64,~~~』形式のデータ(dataスキーム)を生成します。 画像ファイルなどのバイナリデータを Base64 エンコードに変換しています。 data スキーマでは、外部ファイルへのアクセスなしにスクリプト内で完結して画像を表示できるため、 小さなアイコンなどの表示には便利です。data スキームは Firefox・Opera では利用できます。 残念ながら Internet Explorer は data スキームに対応していないので利用できません。 やってみよう 画像URL: ▼ ▼ JavaScript ソースコード生成結果: ここにソースコード結果が表示されます。 ▼ data スキーム経由の画像表示: 生成したコードの使い方
JavaScript のセレクターの定番イディオム 2010-08-30-2 [Programming] わざわざ記事にするまでもないことですが将来のためにあえて記事化。 JavaScript の定番イディオム。 function $(id) {return document.getElementById(id)} document.getElementById() の省略記法として $() を使うためのおまじない。 prototype.js でおなじみの「$」の使い方です。 いわゆる「セレクター」。 これが: document.getElementById('foobar').innerHTML = '<hr>'; こう書けます: $('foobar').innerHTML = '<hr>'; いちいち JavaScript フレームワークを用いずにサクッとやるとき用ですね。
Firefox だとおかしいと言われたので直した。 querySelectorAll を使ってるので Firefox 3.5 以上、Opera 10 以上、Safari 4.0 以上なら使えるはず。 Google検索の上位に表示されているページが元ページへのリンクを貼っただけのサイトでイラッとしたのでグリモン書いた - 今日もスミマセン。 深江直人(カッペ)さんのサイトは邪魔だよね、という話 - 隠れん坊将軍の隠れ蓑 常日頃からウザいと思ってました。 いや、別に検索結果で元の記事より下に来てくれるならあまり文句は言わないのですが、元記事はずーっと下のほうにあるのにこういう役に立たない自動生成ページが上に来るのが許せないのです。 というわけで、snaka さんが最初に書いてた UserJS をフォークしてみました。 http://gist.github.com/153078 http://g
jQueryでSelectタグ系でちょい便利なワザのメモです。 html <select name="hoge_n" id="hoge_i"> <option value="">---------</option> <option value="1">hoge1</option> <option value="2">hoge2</option> <option value="3">hoge3</option> <option value="4">hoge4</option> </select> selectで指定のものを選択された状態に // hoge4を選択状態にしたい場合 $(#pref).val(4); option要素を追加する // hogeというIDのSelectにラベル:hoge5、値:5というOptionを追加 $('#hoge_i').append($('<option>
フレームページで別のページを操作するJavaScriptです。 今回は、別のページの背景色を操作してみたいと思います。 サンプルページはこちらです。 このページのHTML、Javascriptの書き方は以下のようになります。 (1)フレーム画面の大元のHTML <HTML> <FRAMESET ROWS="89,*" FRAMESPACING="0"> <FRAME SRC="another_sample1_top.html" NAME="fr1"> <FRAME SRC="another_sample1_under.html" NAME="fr2"> </FRAMESET> </html> これは単純な親フレームのHTMLの記述ですが、注意点は太字になっている「NAME」部分です。このNAMEの値を利用することになります。 (2)フレーム画面の上部分のHTML・JavaScri
2章 文法 ブロックコメントは使わない 正規表現リテラルの中にブロックコメントの "*/" が出てきてしまうから ブロックで変数のスコープは発生しない。だから、変数はブロックの先頭ではなく、関数の先頭で宣言すべき 3章 オブジェクト オブジェクトから値を取り出すには "[]"よりも "." を使うことを強く薦める。なぜなら、よりコンパクトで読みやすいから。 オブジェクトから値を取得する際に、"||" を使いデフォルト値を設定することができる // o に name という名前のプロパティがない場合、o.name の値は undefined になる。 var foo = o.name || "unknown" undefined に対してプロパティを取得しようとすると TypeError例外が投げられる。 && を使えば、例外を避けられる o.name && o.name.length 4章
Java変態文法最速マスター - プログラマーの脳みそをリスペクト。 JavaScriptの変態文法・技法一覧です。あんまり使わないけど、知ってるとXSSとか攻撃したいのにWAFに妨害されるなど、いろいろ制約があるという場合に便利。 文字列の生成 引用符を使わずにさくっと文字列を作る。fromCharCode とか使ってもいいけどめんどくさいので、正規表現やE4Xを利用。 alert( /string/.source ); alert( <>string</> ) 空白文字を使わず記述 文脈上、スペースを書きたいけれどいろいろ制約があって書けない場合にはコメントで代替。実行するコードを作り上げてevalしてもいいけど大袈裟なので。 var/**/x=1; */ を含むコードブロックをコメントアウト コードの塊りをコメントアウトしようと思って /* */ で囲むと、コード内に string.
はじめに JavaScriptは簡単な言語のようでいて、実は奥が深く、初心者にとってなかなかその本質がわかりにくい言語です。ここでは、JavaScriptの言語的エッセンスを理解できるようなものをFAQ形式で書いてみました。ご意見や誤り等を指摘してもらえたら嬉しいです。 なお、JavaScriptの標準化であるECMAScriptは、今年末にEdition 5 がリリースされる予定です。このFAQは、現在のバージョンであるEdition 3をベースにしています。 ECMAScriptって何ですか? ECMAはEuropean Computer Manufacturer Association(欧州電子計算機工業会)の略で、標準化団体です。NetscapeのJavaScriptとMicrosoftのJScriptをベースに、純粋なプログラム言語部分を抽出したものをECMAで標準化したスクリプ
dTree is a free JavaScript tree menu. There are a lot of tree generating scripts just like this one, and many of them are great. So why use dTree? dTree is very simple to set up and use. You don't have to worry about adding pages to the tree in a specific order, which makes it ideal for generating a tree from a database. The first version of the tree is still available here. Unlimited number of le
qx.io.Json stringify (var v, Boolean beautify?) Stringify a JavaScript value, producing a JSON text. Parameters: v the object to serialize. beautify (default: false) whether to beautify the serialized string by adding some white space that indents objects and arrays. Returns: the serialized object. 第一引数にはオブジェクト指定します。 第二引数に「美しくするかどうか」を指定できます。 とりあえず簡単にデモ。 Qooxdooのデモページを開いて、Bookmarklet的にアドレスにスクリプト書いて
僕自身も僕の周辺もJSONをよく使います。でも、細かい点でけっこうミスをやらかしています(苦笑)。このエントリーで、JSONを使う上で注意すべきこと/間違いやすい点をすべて列挙します。 内容 兼チェックリスト: 仕様原典さえ読めば完璧(のはずだが) 数値の前にゼロを付けてはいけない 16進数表記も禁止だよ 数値の前にプラスを付けてはいけない 小数点からはじまる数値はダメ 用語法が違うよ:プロパティとメンバー メンバー名には常に文字列を使う 空文字列""もメンバー名に使える 配列要素はキッチリと並べよう 文字列を囲むには二重引用符だけ 文字列内のエスケープが微妙に違う 仕様にないエスケープは構文エラー undefinedもNaNもありません ラッパーオブジェクトは使わないのが吉 型システムとtypeofに関する注意 最後に 仕様原典さえ読めば完璧(のはずだが) JSONは、小さくて簡単な仕様
Notes No data is sent to the server (i.e. everything is done in JavaScript). Conversion from Unicode to other encodings such as Shift_JIS can be slow first time as it needs to initialize internal conversion tables. Surrogate pairs in UTF-16 are supported. Try inserting \uD840\uDC0B in the second form. Three-byte characters in EUC-JP are not supported. Links JavaScript Unicode Charts Try GNU Libidn
Kawa.netxp AjaxZip 2.0 - Ajax郵便番号→住所自動入力フォーム(CGI不要版) AjaxZip2は、昨年公開した 『ajaxな住所入力フォーム』 の新バージョンです。 郵便番号を入力すると、該当する都道府県名・住所が自動的に入力されます。 Ajaxと JSON フォーマットを利用するJavaScriptライブラリとして公開しました。 JavaScript のみで稼動するため、サーバサイドで稼動するCGIプログラムは不要です。 郵便番号→住所変換処理は全てクライアントサイドのJavaScriptで行います。 既存 HTML の住所入力フォームをたった3行書き換えるだけで利用できます。 簡単に設置できるため、プログラムに詳しくない方でも導入していただけると思います。 以下の住所入力フォームに、7桁の郵便番号を入力してみてください。 【2007/12/09 追記】 jQ
各所で話題になった「わずか565バイトテトリスのプログラミング解説」。 あの565バイトテトリスの作者がわかったとともに、さらにプログラム行数の圧縮が進められていました! 詳細は、 482バイトテトリス - Cozy Ozy に載っています。 (リンク先は482バイトとなっていますが、手元で改行コードを2バイトで確認してみたところ493バイトでした→追記:Ozyさんからコメントを頂きました。「改行位置を工夫すれば、セミコロンが省略できるので489バイトにできますよ」だそうです) 565バイトテトリスを作ったのは、nanagyouさんという方で、Short Coding本にも名を刻んでいる超絶スーパーコーダーらしいです。 そして初期の565バイトテトリス完成から5年半以上経ち、新しく500バイトを切ったテトリスのソースコードはこちら。 <body id=D onKeyDown=K=event
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く