RSA、AES暗号をJavaScriptで実現できる「cryptico.js」:phpspot開発日誌
ブロック内をiPhone画面内みたいにスクロールできるjQueryプラグイン「Re... 次の記事 ≫：jQueryベースのタブUI１５種まとめ cryptico.js - An easy-to-use strong encryption system utilizing RSA and AES for javascript. RSA、AES暗号をJavaScriptで実現できる「cryptico.js」 JavaScriptで複雑な暗号化アルゴリズムを簡単に実現するライブラリです。 RSAキーの生成には次のようなコードを書くだけです。 // The passphrase used to repeatably generate this RSA key. var PassPhrase = "The Moon is a Harsh Mistress."; // The length of t
JavaScript入門
JavaScript は Web サイトに動的な機能を追加するためのプログラミング言語です。 1995 年に米国の Netscape 社によって開発され、現在では Web 開発に欠かせない技術の一つとなっています。 JavaScript は Web ブラウザ上で直接動作するスクリプト言語であり、ボタンのクリックイベントやアニメーション、フォームの入力チェックなど、インタラクティブな機能を実装するのに利用できます。 JavaScript はブラウザさえあればすぐにプログラムを書いて実行できます。 Web ページの作成において、 HTML や CSS と組み合わせて利用されることも多いです。また、Node.js などを利用することでサーバーサイドの開発も可能となり、 JavaScript はフロントエンドからバックエンドまで幅広い用途で活用されています。 JavaScript は、オブジェクト
$.dataはHTML5 datasetのラッパーではない
$.dataはHTML5のdatasetラッパーでない HTML5では要素に任意の属性を追加出来るdata-*属性がサポートされました。仕様では <div data-foo="bar">...</div> data-fooの値はdiv.dataset.fooでアクセスすることが出来ます。ただしdatasetは現在一部ブラウザでしかサポートされていない。。そこでjQueryに存在する$.dataメソッドを使いましょう、という流れなのですが、$.dataをラッパーとして見た場合結構罠がありおすすめ出来ません。中途半端に対応してしまったために誤解されがちですが、$.dataはdatasetのラッパーではありません。 属性値がJSONとして解釈出来る場合、パースして返す <div id="test1" data-json="{"foo":"bar"}">...</div> $('#foo').da
知ってて当然？初級者のためのJavaScriptで使う即時関数(function(){...})()の全て
(function(){...})()は、 (function($){ $.hoge = function() { }; })(jQuery) みたいに使われていたりするコード。GreasemonkeyとかjQueryのプラグインとか、あれこれ見かけることがあると思います。 この話題はいくつかWebでも取り上げられていますが何がどうなってんのかちょっと難しいですね。しかし、誰でも理解できるレベルではあります。というのも、こういう種の難しさは体系的な知識が備わっているか否かということなのです。 でも、この知識を体系化する作業って結構しんどくて、難しくて、まーハゲるほど悩むこともあるかもしれない。それはきっと、とても毛根に悪いかもしれない。スカルプDも真っ青の状況になるかもしれない。それは、悲しいことなのだと思う・・・っ！ 毛根にはこれからもがんばってほしい！いつだって頭を温かいまなざしで見守
Node.jsがバージョンアップ、初の公式Windows版「node.exe」登場
サーバーサイドJavaScriptのNode.jsが先週バージョンアップし、安定版がV0.4.10に、非安定版がV0.5.2になりました。V0.5.2版では、公式なバイナリとしては初めてとなるWindows版のnode.exeが公開されています（追記、Windows版は正確にはV0.5.1からでした）。 6月末にマイクロソフトがNode.jsの開発を支援することを明らかにした際に、ネイティブなWindows版の登場がアナウンスされていました。あれからわずか1カ月で登場したことになります（参考「マイクロソフト、Node.jsをWindows Azure対応にするため開発元を支援」）。 Windows版V0.5.2のnode.exeは以下のURLからダウンロード可能です（最新版は、Node.jsのWebサイトのダウンロードのコーナーを参照してください）。 node.exe Windows ex
Lightweight Language Planets : 公開資料
当日使われたスライドのうち、許可いただいたものを公開しています。 基調講演 「JavaScriptプログラマのための全方位的完全武装ガイド」mala メタプログラミングの光と闇 イントロダクション：柴田淳 Perl：牧大輔 Ruby：角征典 Python：小泉守義 Haskell：山本和彦 Node.jsとは何だったのか イントロダクション: 「Node.jsとは何だったのか？」竹迫良範 Perl: 「AnyEvent と Coro の復習」竹迫良範 JavaScript: 「10分でわかるNode.js」清水俊博 Python: 「Twistedとかgeventとか」おおたに Ruby: 「EventMachineとは何だったのか」 なひ 「常識を覆すソートアルゴリズムSleep sort」竹迫良範 「Node.jsで学ぶマルチスレッドプログラミング」竹迫良範 JavaScript八面六
DOM ECMAScripting
DOM 仕様書を読む前のガイドとして、DOM のおおまかな内容と ECMAScript（JavaScript）によるごく簡単な例文を提供します。DOM Level 1 から Level 3 まで。DOM Core 入門 (1)DOM Core 入門 (2)DOM Events 入門DOM Traversal 入門DOM Range 入門DOM Load and Save 入門DOM Validation 入門DOM HTML 関連。DOM HTML 入門 (1)DOM HTML 入門 (2)DOM Views、DOM Style Sheets、DOM CSS 関連。CSSOM 入門 (1)CSSOM 入門 (2)CSSOM View 入門未勧告のもの。DOM XPath 入門DOM Abstract Schemas 入門DOM Views and Formatting 入門その他、ウェブプ
プログラミング経験者が JavaScript を学ぶためのリソース - フリーフォーム フリークアウト
移転しました http://please-sleep.cou929.nu/20110721.html
正規表現を明記せず、RegExp#exec を String#split にするとちょっとハッピーに - latest log
JavaScript の小ネタです。 UserAgent 文字列(window.navigator.userAgent) "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/535.1 (KHTML, like Gecko) Chrome/14.0.814.0 Safari/535.1"から、Windowsのバージョン(6.1)を取り出すようなコードをよく見かけますね。 ちょっと前の私は RegExp#exec + parseFloat で、こんな(↓)感じにしていたり、 function getWindowsVersion() { var m = /Windows NT (\d+(\.\d+)?)/.exec(navigator.userAgent); if (m) { return parseFloat(m[1]); } return 0;
2011-07-01のJS: IE10pp2、Opera 11.50、High Performance JavaScript
JSer.info #24 - IE10pp2とOpera 11.50がリリースされて、少しずつブラウザ間でWeb標準が整ってきている感じがします。(逆に新しいものも増えてるけど) また、IEではWebGLはまだサポートされていませんが、IEでもWebGLを動かせるようにするプラグイン?が出ています。 全体的にブラウザのアップデートペースは速くなってきているため、バージョン毎に比較する事の価値は下がってきているかもしれません。それに関連してFirefoxのバージョンポリシーの変更について考える - Future Insightを読むと面白いかもしれません。(Mozilla Japan ブログ - Firefox の法人利用についても一緒に) ヘッドライン 『Internet Explorer 10 Platform Preview 2 を公開 - Internet Explorer ブログ
JavaScriptによるスタイルシート(CSS)の操作
スタイルシートには、CSSファイルに記述されたスタイルルールと、各タグに記述されたスタイル属性があります。スタイルルールは、タグ名やクラス属性やID属性などを使ったセレクタによって、適用されます。 そこで、JavaScriptを使って、スタイルシートに関する各種データを操作する方法を紹介します。 このプログラムは、IE8, IE7, IE6, Firefox3, Safari4, Opera10, Sleipnir2で動作することを確認済みです。 スタイルシートは、document.styleSheets で取得できます。 ファイル毎に、配列として格納されています。 各スタイルシートには、スタイルルールの配列として格納されています。 スタイルルールは、セレクタとプロパティ＋値の形式に分かれて取得できます。
DOM APIとinnerHTMLは等価ではない
最近、徳丸本をじわじわ読んでいるのですが、DOM based XSSの話が書いてあったので、少し言及しておこうと思います。 徳丸本から引用 DOM based XSSと呼ばれるXSSがあります。これは、JavaScriptによりクライアント側で表示処理する箇所があり、そこに脆弱性がある場合のXSSです。 サンプル書いてみました。 <script> document.write(unescape(location.href)); </script> こいつを適当なファイル名で保存して、domxss.html#<script>alert("hello")<script>などのURLでアクセスするとalertが表示されるはずです。任意のスクリプトが実行可能な状態ってことですね。任意のスクリプトが実行可能ってことは、セッションクッキー盗み放題で、他人に成り済まして買い物できちゃったりするレベルです
JavaScript：unescapeHTMLの妥当な実装
JavaScriptにはHTMLを実体参照化する関数、PHPで言うところのhtmlspecialchars()にあたる関数が存在しません。 正式な理由はよく知りませんが、教科書的な回答としては、「DOMを使えばエスケープなんて気にしなくていいよ」が挙げられるでしょう。うだうだ言わず黙ってDOMを使うべし。 …まあでも、必要なケースもあるでしょう。特にinnerHTMLの高速性は魅力的です。T.jsを作ったときにベンチマークを取ったのですが、エスケープ関数をはさんでもinnerHTMLの方が高速に動作することが確かにありました。 そんなわけで、世の中にはHTMLをエスケープする自前実装の関数があふれています。さんざん語り尽くされている気もしますが、prototype.jsの実装を見ていて少し気になったので取り上げてみます。 escapeHTMLの場合 escapeHTML 文字列中の特定の文
JavaScriptの”this”をめぐる冒険 |
JavaScriptの"this"って難しいですよね。理解しないまま使ってると、思わぬところでグローバルオブジェクトを指していたり、そもそもvarでプライベートな変数にすべきところにもthisを使っていたり…。私もthisには散々悩まされてきたので、そろそろ完璧に理解しようと思い、以下の記事をまとめてみました。間違いを見つけたら指摘して頂けるとありがたいです。なお、文中の引用文章は読みやすさを考慮して適宜改行、強調を行っています。 thisとは何か。 まずは仕様書を見てみましょう。 ECMA-262 3rd 11.1.1 The this Keyword The this keyword evaluates to the this value of the execution context. ECMA-262 5th 11.1.1 The this Keyword The this k
JavaScriptのテンプレートエンジン「T.js」を公開しました
結構前に公開していたんですが、きちんとした紹介を書いてなかったので改めて。Githubにて、T.jsという名前のJavaScript用テンプレートエンジンを公開しています。 T.js - DOMBuilder-like template engine for JavaScript T.jsとは JavaScriptでHTMLを書くためのライブラリ（一種のテンプレートエンジン）です。 T.table("#addressbook")({style:{borderCollapse:"collapse"},border:"5"}, T.thead( T.tr( T.th("name"), T.th("address"))), T.tbody( T.tr(".odd")( T.td("alice"), T.td("a street")), T.tr( T.td("bob"), T.td("b str
JavaScriptの HTMLエスケープ関数を 140字以内で書いてみる
JavaScriptで動的にWebページの内容を書き換える場合に、文字列のHTMLエスケープをしたい時がある。具体的には、「& " ' < >」の5つを変換したい。 PHPならhtmlSpecialChars()、Railsならh()でよいが、JavaScriptにはHTMLエスケープ用の関数が用意されていないので自分で書く必要がある。 せっかくなので、Twitterでつぶやける文字数以内で書くことを目指してみる。 で、こうなった。 function h(s){return s.replace(/[&"'<>]/g,function(m){return"&"+["amp","quot","#039","lt","gt"]["&\"'<>".indexOf(m)]+";"})} 123文字。 意外と余裕だ。 クォーテーションのエスケープをしないでいいなら（HTML要素の属性値のHTMLエスケ
IE6〜8でCSS3セレクタ利用「Selectivizr」
CSS3セレクタを使う上で問題となるのはやはりIEです。HTML5 & CSS3 Supportで確認すると、IE6～8はほとんど対応できていないことが分かります。 そんなIEでもCSS3セレクタを使えるようにするのがSelectivizr.jsです。詳しく紹介されているサイトがあまりなかったのでご紹介。 Selectivizrの設置方法 ここで提供されているselectivizr.jsとJavaScriptライブラリを外部ファイルで読み込むだけで、CSS3セレクタがIE6～8でも利用可能となります。コードも外部ファイルを読み込むだけですのでとてもシンプルです。 <script type="text/javascript" src="[JSライブラリ]"></script> <!--[if (gte IE 6)&(lte IE 8)]> <script type="text/javascr
wise9 › JavaとJavaScriptの20年戦争
モバイルゲーム 物凄い勢いで勃興したモバイルゲーム業界は、いろいろな課題や問題に直面しながらも巨大化し、今日の時点でのスマートフォン向けゲームの市場へと継承されていきます。 モバイルゲームの歴史 2001 Javaアプリと3Dゲームの登場 Javaが利用できるようになったことにより、ダウンロード型のゲームが供給できるようになりました。 2002 携帯電話端末の大容量化・3D化競争 Java搭載携帯電話端末が登場してからごく僅か1年の間に、アプリのサイズに関しては10倍に広大化し、表現方法も2Dから3Dにシフトし始めました。J-PHONEは『ゼビウス』や『スペースハリアー』などといった昔のアーケードゲームを、ドコモはSIMCITYなどパソコンで世界的規模のヒットを飛ばしたゲームを主力商品としていました。 2003 モバイルゲームの一般化 メモリの制限が厳しいJava仮想マシン上ではなく、OS
Big Sky :: スコープと参照と...
部下にも何度も説明してて、この辺がC言語のポインタみたいな鬼門なのかなーとか思いながら。 javascriptでhtml内のonclickの内容を書き換えようとしています.. - 人力検索はてな javascriptでhtml内のonclickの内容を書き換えようとしていますが 変更後の関数に変数を渡すと、変更後の関数(load)自体が実行されてしまい、うまくいきません 現在は以下のように、onclickの内容を変更しようとしていますが、 関数を実行させずに、html内のonclickの内容だけ書き換える場合はどのようにしたらいいですか？ document.getElementById('box').onclick = (function(id){ load(id) })(userid); http://q.hatena.ne.jp/1305849029 こういうコードになった経緯を考える
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Web Scratch
