I was recently reminded about Dmitry Baranovsky's Javascript test, when N. Zakas answered and explained it in a blog post. First time I saw those questions explained was by Richard Cornford in comp.lang.javascript, although not as thoroughly as by Nicholas. I decided to come up with my own little quiz. I wanted to keep question not very obscure, practical, yet challenging. They would also cover wi
Python Hack-a-thon #3でLTした時の資料をslide shareにupしました。Google App EngineでServer-side JSやれるよ、といった内容なのですがスライドの内容が殆ど無いのと、CommonJSとかその辺の説明をおもいっきり省略したので、少し補足。 Google App Engine で初めるServerSide JavaScriptView more presentations from hagino 3000. 発表した通りに、nitroというフレームワークを使ってGAE上でjsを動作させようとすると次の知識が前提になってきます。 Rhino CommonJS Narwhal jack nitro 以下、それぞれについて簡単な説明を。 Rhino JavaScriptのJava実装。ServletからRhinoを呼んでJavaScript
document.elementFromPoint という便利な関数を知ったので、今作っている Chrome 用 Migemo ページ内検索で使ってみた。 これが困ったことに、ブラウザごとにかなり挙動が違うのだけど、本来の動作はこんな感じらしい。 待望の document.elementFromPoint が Firefox 3.0a8pre にて実装された。仕様は nsIDOMNSDocument.idl に詳しく書いてあるが、おおよそ以下の通りである。 HTML, XUL どちらの document に対しても使用可能 document の左上を (0, 0) とし、位置 (x, y) にある実際に見えている要素を取得する 同一の document 内に存在する要素のみ取得可能。例えばインナーフレーム内の document 内に存在する要素は取得できず、代わりに iframe 要素を返
はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28
というわけでやってまいりましたこのコーナー! 本日のお題は「Selection内のHTML Textをいい感じに取得する - 枕を欹てて聴く」でございます。選択範囲のHTMLソースを抜き出すというやつですね。では早速いってみましょう! if(src.focusNode){ // selection まずは HTML5 テキスト選択 API の Selection オブジェクトが登場! 以後これに対する操作が続きます。しかしこの Slection オブジェクト、getRangeAt メソッドを使うとなんと選択範囲に対応する DOM 2 Traversal and Range の Range オブジェクトが取れちゃうんです! // common parent node search (以下 21 行省略) それ Range#commonAncestorContainer で取れるよ! // c
追記: Rangeを使うと, 86行に及ぶDOM操作がなんと2行に! 勝手に添削: Selection内のHTML Textをいい感じに取得する: Days on the Moon Tomblooの最新版ではEvernoteの取り込み機能がつき, これに伴いHTML Textを取得する周りで大規模な変更がありました. これのなかで nsIDocumentEncoder などのXPCOMが使われているのですが, Taberareloo移植の際, もちろんXPCOMなんてものはChromeにはありません. それで, 書いてみました. function convertToHTMLString(src, safe){ var doc = src.ownerDocument || src.focusNode.ownerDocument; if(src.focusNode){ // selection
気になったこと 朝から自分の書いたコードを眺めていたら、次のようなコードを発見した。もちろん hoge とか huga なんて関数名を実際に使っているわけではない。 function hoge(collection, options) { options = options || {}; // 略 let flags = options.flags; // 略 } hoge([1, 2, 3]) のようにして options が指定されずに呼ばれたとき、 options が undefined になって options.flags で例外が発生してしまうので、それを防ぐために {} を代入している。 ここは特に引っかかることもないのでもう少しそのコードを眺めていたら、今度は次のようなコードに出くわした。 function huga(collection, options) { if (!o
1/23(土)に神戸で Webteko(ウェブテコ)第11回が開催された(告知ページ) 今回のテーマは「HTML5 と CSS3」ということで、僕も Web Workers について発表してきた。 発表内容 Try WebworkersView more documents from H M. サンプルコード デモとして、バックグラウンドで足し算を行う JavaScript コードを紹介した。あと、1%分完了するたびに進捗状況を表示してる。計算してる途中でもブラウザが固まらないってのがポイント。 まずこれが HTML ファイル。入力ボックス、ボタン、結果表示欄があるだけ。 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Web Workers を使って足し算する</title> <script type="applic
WebKitにrubyタグのレンダリングのサポートが入ったので、新聞社のサイトなどで狡猾(こうかつ)な犯行などと書いてあるものをrubyタグで包むスクリプトを書いた。 // console.time("benchmark"); var r = document.evaluate( './/text()[contains(., "(")]', document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null ); var i; var node; var re = /(.*?)([一-龠]+)(([ーぁ-んァ-ヶ]+))/g; var match; var range = document.createRange(); var text; for (i = 0; i < r.snapshotLength; i++) { node = r
はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28
O'Reilly Japan から書籍『初めての JavaScript 第 2 版』(Shelley Powers 著、武舎広幸・武舎るみ訳) (Amazon) が出版されています。出版にあたって、私が技術レビューを務めさせていただきました。販促効果があるのかわかりませんが、帯に推薦文も寄せています。 単なる JavaScript の書き方にとどまらず、デバッガの使い方など基礎になる事柄を幅広く取り扱っていますので、JavaScript を始めたいという方は一度手にとってみることをお勧めします。また、周囲にそのような方がいる場合もぜひ勧めてあげてください。 読み終えた方は、『JavaScript 第 5 版』(Amazon) や『JavaScript: The Good Parts』(Amazon) に進むのもいいですし、Prototype.js などのコードリーディングをしてみるのもいい
Sammy What Sammy is a tiny javascript framework built on top of jQuery. It’s RESTful Evented JavaScript. Why jQuery is probably the fastest, most robust way to abstract basic low-level Javascript functionality that every Javascript developer needs. However, it really remains low-level and does not imply any structure or organization for larger scale Javascript applications. Working heavily with Si
前回書いたエントリー「JavaScriptのswitch文の速度はブラウザの違いでこんなにも差があった。」に予想外にたくさんのブックマークがつき、貴重なコメントも頂きありがとうございます。それにインスパイアーされたので、ちょっと補足を書きました。個々の項目はブコメにヒントを得ましたが直接対応するものではありません。 どうしてこんなパフォーマンステストをしたの? switch文のパフォーマンスを測定する動機になったのは、あるコードを読んでいたら、多量のswitch文があり、しかも、caseの数も多い。非常に見通しが悪い上に、これじゃ遅いだろうなと直感的に思いました。でも、ふと、switch文のcaseが定数なら分岐は高速に実行するようにコンパイルされるのではないか?JavaScriptのswitchはif-elseの並びと意味的には類似だけれど、caseが定数に限定されるなら、caseが多い
<!DOCTYPE html> <html> <head> <title>test</title> </head> <body> <div id="for_test"></div> <script type="text/javascript"> var p_elem = document.getElementById("for_test"); var test_elem = p_elem.appendChild( document.createElement("a") ); test_elem.appendChild( document.createTextNode(" @test ") ); test_elem.setAttribute( "href", "http://example.com/" ); </script> </body> </html> という HTML を表示すると、
ECMAScript-262 5th で新しく追加された関数/メソッドの対応状況を調べてみました。 Ch3: Google Chrome3.0.195.38(stable) Ch4: Google Chrome4.0.266.0(dev) Fx3.5: Firefox3.5.3 Fx3.6: Firefox3.6β5 Op10.10: Opera10.10 Op10.50: Opera10.50α Sa3: Safari3.2.3(windows) Sa4: Safari4.0.4(windows) iSa4: iPhone iOS 3.1(WebKit 528.18) uupaa: uupaa.js 0.7 こちらもあわせてご覧ください http://kangax.github.com/es5-compat-table/#showold Browser(Library) Ch3 Ch4
週末料理をしていて足を切ってしまいました。agoです。 以前Perlは書いていたんですが、その頃以下の記事を読んで非常に感銘を受けました。 Perlプログラマのレベル10 - Perlプログラミング救命病棟より - naoyaのはてなダイアリー 当時あまりコミュニティとのつきあいがなかったので、「自分のスキルの絶対位置」、「次のレベルへ行くために必要なもの」を知ることで非常に安心感を感じた記憶があります。 いま確認したところ、「JavaScriptプログラマのレベル10」はないようなので書いてみました。 Perlプログラマ Schemeプログラマ Rubyプログラマ (本家に直接リンクできるURLが無かったため、参照ページへリンクしています) haskellプログラマ 堕落したCプログラマ HTML知識レベル プログラマレベル 企業法務 JavaScriptの業務スキルレベル 判別表 (5
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く