script, styleタグ内のコードの書き方 - os0x.blog
# 最初にちょっと余談を。Chromium-Extensions-JapanのほうにChrome6 Betaの変更点を書きました。どうぞよろしく。 さて、scriptタグ内をHTMLコメントで括ってからJavaScript書くのって意味あるの? - Togetterの件に関して、関連ネタをいくつか書いておきます。。 まず前提として、scriptタグの中に直にコードを書くというのはできる限り避けたほうが良いです。とはいえ、ちょっとしたコードをいちいち外部ファイルにしていると読み込みのコストも馬鹿にならないので、インラインで書く事もよくあります。なので、以下は主に数行程度のコードをインラインに書く場合の話です。 scriptタグの中に直にコードを書くときはscriptタグに非対応なブラウザのために<！--で始め*1 // -->で閉じるというノウハウは今でも結構使われているみたいです。 しかし
JavaScriptを高速化する6つのテクニック | エンタープライズ | マイコミジャーナル
Thomas Fuchs, author of the script.aculo.us user interface JavaScript library, a member of the Prototype core team and a Ruby on Rails core alumnus. Thomas Fuchs氏が6 easy things you can do to improve your JavaScript runtime performanceにおいてJavaScriptの実行パフォーマンスを改善するための6つのテクニックを紹介している。Thomas Fuchs氏はscript.aculo.usの開発者であるとともにPrototypeコアチームのメンバーも務めている。またRuby on Railsでコアチームで開発を担当していたこともある。 JavaScriptエンジン
EfficientJavaScript - Dev.Opera - 効率的な JavaScript
EfficientJavaScript - Dev.Opera - 効率的な JavaScript 目次 この文書について 効率的な JavaScript ECMAScript eval や Function のコンストラクタを使うのはやめよう eval を書き換えよう 関数を使いたいなら function を使おう with を使うのはやめよう 性能を決める関数で try-catch-finally を使うのはやめよう eval と with は隔離しよう グローバル変数を使うのはやめよう 暗黙のオブジェクト変換に気をつけよう 性能を決める関数で for-in を使うのはやめよう 文字列は累積スタイルで使おう プリミティブの操作は関数呼び出しより速い setTimeout() や setInterval() には文字列でなく関数を渡そう DOM 再描画と再フロー 再フローの回数をでき
for 文を setTimeout に変換する - IT戦記
for 文で 100 項目とか 1000 項目とかあるテストケースを処理するとブラウザが固まる。 こんなダイアログが表示されます。 ということで for 文を setTimeout や setInterval に変換する事で定期的にブラウザに処理を戻すことができる。 // ここでは console.log のところでログを取ってますが // 通常は処理が入ります。 for (var i = 0; i < 3; i ++) { console.log('a' + i); } /* * 結果 * a0 * a1 * a2 */ これをまず while 文に変換 var i = 0; while (true) { if (!(i < 3)) break; console.log('a' + i); i ++; } /* * 結果 * a0 * a1 * a2 */ で、 setTimeout に
IT戦記 - 一行で IE の JavaScript を高速化する方法
以下の一行をすべての JavaScript の前に読み込む /*@cc_on _d=document;eval('var document=_d')@*/ この一行を読み込むことによって IE での document へのアクセスが 5 倍速くなります。 たとえば 以下のように、読み込む前と読み込んだ後を比較してみます。 // Before var date = new Date; for (var i = 0; i < 100000; i++) document; alert(new Date - date); // 643 /*@cc_on _d=document;eval('var document=_d')@*/ // After date = new Date; for (var i = 0; i < 100000; i++) document; alert(new Date -
JavaScript で引数束縛: Days on the Moon
引数束縛 (カリー化) の話。まずは「JavaScriptでカリー化」(檜山正幸のキマイラ飼育記)。タイトルを見てどこかで聞いたような話だなと思ったら「関数の変形」(Effecttive JavaScript - Dynamic Scripting) だった。だが、前者は文字列に戻してから評価というのが力技っぽくて個人的に好きでないし、後者は汎用的過ぎていささかわかりにくい。そこで今回は先頭の引数から束縛していくというのに的を絞ってみたいと思う。 まず第 1 引数のみを束縛する場合。Function#apply を使えば引数を配列として渡せるので、束縛された値と後から渡された引数とを連結してやればいいのではないか。 function curry(func) { return function (first) { return function () { var args = Array.p
グローバルオブジェクトの参照はも function 宣言時に決まる - m2
以前「window オブジェクトを汚さないネタ」で疑問に思ったので検証しました。 parent.html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html><head><title>Window テスト(Parent)</title> <script type="text/javascript"> window.name='parent'; function hello(){ alert('hello:'+window.name); } function openChild(){ var w=open('child.html','','width=400,height=400'); w.parentHello=hello; } </script> </head> <body> <p><button o
style 要素を動的に生成する - m2
普通に考えればこんな感じ。 var style=document.createElement('style'); style.setAttribute('type', 'text\/css'); style.innerHTML='…'; document.getElementsByTagName('head')[0].appendChild(style); が、IE6 では style 要素の innerHTML プロパティは readOnly のようで、3行目でエラーになります。 「エラー：未知の実行時エラーです。」という、よくわからないエラーメッセージです。 これを以下のようにして回避することができました。 var wrap=document.createElement('div'); // 最初に style でないノードが無いと style が生成されない wrap.innerHT
IEを超シンプルに判定する方法: ある SE のつぶやき
Sniff! 上記の記事で、IEを超シンプルに判定する方法が紹介されていました。 var isMSIE = /*@cc_on!@*/false; たったこれだけです。 IEの条件付コンパイルを利用しているようですが、IE5.01, IE5.5, IE6.0, IE7.0, FireFox2.0, Opera9.1.0 で問題なく動作しました。 うーむ。すばらしい。
Unicodeエスケープ - sawatのブログ
付箋紙Greasemonkeyで、GM_setValueに登録した日本語の文字化け対策にencodeURIをつかったけど、encodeURIはURIをエンコードするための関数なのであんまり褒められた使い方ではないですね。しかも、encodeURIのようなURLエンコーディングは文字列をUTF-8にしてから、エンコード対象の各バイトを%xx形式*1で表現するので、日本語１文字をあらわすのにたいていの場合ASCII9文字が必要になって効率が悪いです。*2 なので、前述のような単に非ASCII文字をエスケープしたいだけのようなケースではUnicodeエスケープを使った方がよいです。Javaのpropertiesとかnative2asciiとかのやつです。 Unicodeエスケープは\uxxxx*3の形式であらわすので、たいていの日本語１文字はASCII6文字になって、URLエンコーディングに比べ
miya2000の日記 - これからドラッグ＆ドロップを書く人のために
2012/07/22 追記 久しぶりに確認したところ、IE9 では以下で指摘している IE (このときは IE6 でした) の問題(3, 4, 6)がすべて解消されていました。 また、Firefox での問題(5)も Firefox14 で試したらは解消されていました(ただ、All-in-One Sidebar のパネルの上では mousemove イベントが発生しないようでした)。 Chrome20 や Safari5 でも問題無く動作していますから、現在においてドラッグ＆ドロップを実装するには mousedown 時の preventDefault() だけでOKと言えそうです。すばらしいですね！ safari で動かないらしいのでどなたか情報ください！(くやしい!) というかこういうのに勝ち負けはないので実装できてる方は是非トラックバックお願いします。当方既に ipod 中毒ですし
JavaScript, Neo-Generation/演算子
この演算子は ==, != と違って型も一致するかどうかを調べます。 すなわち値の自動変換が行われません。 alert("1" === 1); //false alert(1 === 1.0); //true alert("0" + 1 !== "01"); //false delete 演算子はオブジェクトのプロパティや Array オブジェクトの要素を削除します。 成功すれば ture を返します。 var ary = new Array(1, 2, 3, 4); //3番目の要素を削除 alert(delete ary[2]); //true alert(ary[1]); //2 alert(ary[2]); //undefined オブジェクトそのものは削除できせん。 var i = 1; alert(delete i); //false var ary = new Array(1
scope chain - Thousand Years
いまさらながらスコープとスコープチェーンの話。スコープチェーンについて分かったつもりになっていたのですが以下のサンプルコードのfooの値は○○○だ！って思ってたけど違った。 foo = 'hoge'; function hoge(){ var foo = 'foo'; function foo(){}; alert(foo); // ??? }; hoge(); scope chainとLEGBルール*1 ECMAScriptの仕様書にはscope chainという用語で説明されている、要はスコープをどうやって探していくかの順番の定義。図にまとめると以下のような具合。 初めてのPythonではPythonのスコープ検知の順番をLEGBルールとして紹介している。Lはローカルスコープ。Eはエンクロージングファンクションズスコープ(JavaScriptで単にクロージャと呼ばれている。)。Gはグロ
Collection & Copy - ヒアドキュメント、IE専用、コメント
JavaScript function hdoc(){ return arguments.callee.caller.toString().match(/hdoc\(\/\*(([\n\r]|.)+)\*\/\)/m)[1]; } function hdocTest(){ var message = hdoc(/* Peter Piper picked a peck of pickled peppers; A peck of pickled peppers Peter Piper picked. If Peter Piper picked a peck of pickled peppers, Where's the peck of pickled peppers Peter Piper picked? */); alert(message); } 関連リンクCollection & C
最速インターフェース研究会 :: Functionコンストラクタを使ってJavaScriptネイティブじゃない関数をラッピングする方法
ExternalInterface.addCallback で定義された関数は apply できない http://d.hatena.ne.jp/nitoyon/20070214/p1 っていう記事に書いてあるコードを手直し。Flashをいじってないんで、上手く動くかどうかよくわかんないですが、こんな感じでいけると思います。 function applySwf(swf, method, args){ if(swf && typeof swf[method] == "function"){ var params = []; for(var i=0;i<args.length;i++) params[i] = "_"+i; Function( params.join(','), "this("+params.join(',')+")" ).apply(swf[method], args); }
煤 - Note : Creammonkey でJSONP を使ってドメインを越えてみる
■ Creammonkey でJSONP を使ってドメインを越えてみる Sun, 11 Feb 2007 23:30 @645 /coding del.icio.us hatena clap! Safari 版GM であるCreammonkey にはGM_xmlhttpRequest 相当のメソッドがありません（XHR は使えるけどドメイン越えできない）。デバッグ中にそのことを思い出して、試しにJSONP で代用してみることに。普通に行けた。 作ったやつを置いときます。前作ったassociate this をSafari で動くように作り直しました。Safari 2.0.4 + CM 0.8、Fx + GM 0.6.7.20070131.0 で確認。そのまま使うと僕がログ取れちゃったりするので、テスト以外で使う場合は自分でその辺どうにかした方がいいよ。 ちなみにいじってて気付いたのですが、
document.writeハック - Thousand Years
ハックその1 document.write = function() { var arg = []; var scripts = document.scripts; for(var i=0,f=arguments.length;i<f;i++){ arg[i] = arguments[i]; }; scripts[scripts.length-1].insertAdjacentHTML('beforeBegin', arg.join('')); }; 効用 上記ハックを実施するとdocument.createElement('script')で動的にscript要素を追加してもdocument.writeされる。補足ですが、document.createElement('script')で動的にscript要素を追加してもやはりdocument.scriptsの最後に追加されます。つまり、
IE５でアルファチャンネルPNGを使うための一番簡単なライブラリ あるいはIEの失われたテクノロジに驚異せよ
http://d.hatena.ne.jp/amachang/20070206/1170715555 http://labs.unoh.net/2007/02/ie6_png_fix.html http://web.kankodo.net/2007/02/01-233315.html http://phpspot.org/blog/archives/2007/02/iepngjavascript.html なんかはやってるみたいなんで作ってみました！ 一番設定が簡単だと思う。IE5IE5.5以上なら多分動く*1。 あとIEすごいよ！というお話 やりかた 1.次の内容を alpha.htc という名前で適当なところに置く <SCRIPT LANGUAGE="JScript"> (function(){ runtimeStyle.filter += 'progid:DXImageTransfo
JavaScript でブロックスコープを実現する: Days on the Moon
JavaScript には基本的にブロックスコープというものが存在しない。どうしてもブロックスコープを扱いたいときは function 式を使ったりする。 var a = 10; { var a = 20; print(a); // 20 } print(a); // 20 var a = 10; (function () { var a = 20; print(a); // 20 })(); print(a); // 10 だがやはりブロックスコープがあったほうが便利ということで JavaScript 1.7 では let 式、let 文、let 宣言が導入される。 var a = 10; let (a = 20) { print(a); // 20 } print(a); // 10 しかしこれでは対応するブラウザが Firefox 2 以降などに限られる。ところが、with 文とオブ
ウノウラボ Unoh Labs: IE6でアルファチャンネルを含むPNGを表示する
GT Nitro: Car Game Drag Raceは、典型的なカーゲームではありません。これはスピード、パワー、スキル全開のカーレースゲームです。ブレーキは忘れて、これはドラッグレース、ベイビー！古典的なクラシックから未来的なビーストまで、最もクールで速い車とカーレースできます。スティックシフトをマスターし、ニトロを賢く使って競争を打ち破る必要があります。このカーレースゲームはそのリアルな物理学と素晴らしいグラフィックスであなたの心を爆発させます。これまでプレイしたことのないようなものです。 GT Nitroは、リフレックスとタイミングを試すカーレースゲームです。正しい瞬間にギアをシフトし、ガスを思い切り踏む必要があります。また、大物たちと競いつつ、車のチューニングとアップグレードも行わなければなりません。世界中で最高のドライバーと車とカーレースに挑むことになり、ドラッグレースの王冠
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
