via: Wat 上記LT動画から。 笑いのツボまで理解できてないのですが、面白いのでぜひ。 その中で以下のJavascriptで以下を実行したらどーなる？的なのがありました。 答えを見るまえに一度考えてみてください。 1. [] + [] 2. [] + {} 3. {} + [] 4. {} + {}答えは画面を下までスクロールさせてください。 答えは以下のように。へぇー。 % /System/Library/Frameworks/JavaScriptCore.framework/Versions/A/Resources/jsc > [] + [] > [] + {} [object Object] > {} + [] 0 > {} + {} NaN > そして、macにあるjscというJavascriptのインタラクティブなコマンドの存在も知らなかった。へぇー。
続：Androidブラウザでviewportのwidth指定 １年ほど前にAndroidブラウザでviewportのwidth指定という記事を書いたのですが、１年間いろんな端末や状況に対応しているうちに今は結構違うスクリプトを利用しています。 var portraitWidth,landscapeWidth; $(window).bind("resize", function(){ if(Math.abs(window.orientation) === 0){ if(/Android/.test(window.navigator.userAgent)){ if(!portraitWidth)portraitWidth=$(window).width(); }else{ portraitWidth=$(window).width(); } $("html").css("zoom" , por
今更ながら、ここもHTML5にしてみようかなという気持ちが湧いてきています。以前は、一旦公開した文書の形式を無闇に変えるのはよくないという思いが強かったのですが、個人のページなのだし色々と実験的なことをもっと試してもいいのでは、と思うようになったので。 さて、HTML5導入にあたり一番気にしていたのが、IEでHTML5の新しい要素を使う方法のことでした。今だと html5shiv を使って以下のようなコメントを入れるのが一般的になっているようです。 <!--[if lt IE 9]> <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script> <![endif]--> しかしながら、HTML文書というのは様々な環境で利用されるための文書形式だと自分は考えているので、その中に(コメントとは言え)特定のブラウザのた
node.jsのデモとしておもしろいのでメモ。 iPhoneの傾きをsocket.ioでサーバーに送って、socket.ioの全てのコネクションと同期させる。 iPhoneの加速度センサーは、Safari上のjavascriptからも利用できるので、javascriptだけでできる。 サーバー io.on('connection', function(socket) { socket.on('accelerate', function(accel) { socket.broadcast.volatile.json.emit('move', accel); }); }); クライアント 回転のアニメーションは、jquery rotate を使いました。 $(function() { var tyome = $('#tyome'), defaultLeft = parseInt(tyome.o
ある値を非同期で取ってくる→その値を使ってさらに非同期処理というのをJSDeferredでする - Islands in the byte stream 何気なく書かれているけど、console.log('got %s', foo);という部分があり、おや？と思った。 もしかして、Node.js 以外でも使えたりする？ と調査。 まず、Operaは使えなかったので除外。 CodeGoogleChormeFirefox console.log("%s", "hoge")hogehoge console.log("%s", "hoge", "foo")hoge foohoge foo console.log("%s", "hoge", {foo:"FOO"})hoge ▸Objecthoge ({foo:"FOO"}) console.log("%d", 10)1010 console.log
<html> <head id=headelement> <title>document.head></title> <script> var id1=document.head.id; </script> </head> <body> <script> var id2 = document.head.id; </script> <form name=head id=formelement><input type=text></form> <script> var id3 = document.head.id; document.write(id1); document.write("<br>"); document.write(id2); document.write("<br>"); document.write(id3); //id3 is "formelement" on some
(04/29)コードレビューの温度感表現に絵文字を使う (11/20)シェルの `if` はパイプ出来る (05/10)ノーコード・ローコードについての所感 (03/24)正規表現で何でもパース出来ると思うな (02/14)WSL2のインストールからTIPS迄まとめ (12/14)シェルスクリプトと改行コードの罠 (10/11)探し出せないページ (08/11)`xargs` で空白込みのパスを扱う (01/30)JavaScript無しでハンバーガーメニューを実装してみた（けど、恐らく使うべきではない） (01/03)プログラミング書き初めを行う「kakizome」リポジトリというアイディア JavaScriptでスタイルシートを操作するには? JavaScriptで既存HTMLページにCSSを追加する必要が出て来たのでちょっと調べた。 基本的に、document.styleSheets
先に表示される赤いのがinnerHTML。 次の下の方に短い緑のがinsertAdjacentHTML。 右に行くほど、よりたくさんつまった要素に挿入しています。 棒にマウスを載せると時間が表示されます。 insertAdjacentHTMLの処理時間が一定なのに対して、 innerHTMLは値のサイズに比例して処理時間がかかる。 function measureAndDrawGraph(settings){ // 文字列を要素に挿入する関数 var insertTextTo = (function(){ if(settings.method === "innerHTML"){ return function(elm){ elm.innerHTML += settings.addingText; }; }else if(settings.method === "insertAdjacent
jQueryプロジェクトがStandards Teamという名前のサブチームを立ち上げたことを発表しています。 Announcing The jQuery Standards Team jQuery Standards Teamは、標準化団体やベンダーに対し、Web開発者という立場から働きかけていくチームです。Web標準やブラウザ相互運用性の重要性は高まるばかりですが、Web開発者コミュニティと、標準化団体・ベンダーとの連携はそこまでうまくいっていないという問題意識から生まれたようです。 ブログの中では、標準化団体の持つ標準化プロセスの難しさ、長くなりがちな議論に割ける時間が開発者にない、ブラウザ開発者が活発に議論するメーリングリストでは技術への深い理解が必要という雰囲気になっているといったことが課題として挙げられています。 jQuery Standards Teamは次のゴールを掲げ、関
自分の感じたことをきれいにまとめてくれてる文章があったので適当訳。 http://www.sitepoint.com/google-dart-fail/ Google Dartがなぜ的はずれなのか DartはGoogleによる構造化されたウェブアプリケーションを設計するための新しい言語だ。サーバ上で動作させることもできれば、クライアント上で動かすこともできる。つまりブラウザ上で。 あなたが何を読んだかによって、GoogleはDartがJavaScriptの代替になることを認めていたり否定していたりするだろう。しかし、Chromeは近いうちに両方の言語が利用可能になり、選択肢が与えられることになる。もちろんGoogleは開発者たちが彼らのコントロール下にある技術を選ぶことを望んでいると私は確信している。 最初は私もDartに懐疑的でありつつも評価はより多くの情報が出てくるまで保留していた。し
http://d.hatena.ne.jp/yosuke_furukawa/20111002/1317572377で知って、原文を読んでみたら罵倒しまくってて面白かったので全文翻訳してみました。 原文はNode.js is Cancerです。 ウェブデベロッパー逹は伝統的なやり方よりも冴えたやり方が大好きだが、伝統的なやり方がなぜ伝統になってるかというと動きやがるからだ。Node.jsのナンセンスな振る舞いにはしばらくムカついてたが、Node.js作者のRyan Dahlによるこのポストを読むまでは相手しないようにしてた。「UNIX難しいよぅ」とか弱音を吐くよく居るタイプのマヌケに肩をすくめていただけだ。 でも、家族連れのミニバンをガサ入れしたら50kgの上物ヘロインを見つけてしまった警官が世の中間違ってると感じるように、こいつの弱々しいすすり泣きの何が間違ってるのか考えた。たぶん、たぶん
昨日の日記の続きで、Ajaxに固有なセキュリティ問題について検討します。今回はJSON等の想定外読み出しによる攻撃です。これら攻撃手法は本来ブラウザ側で対応すべきもので、やむを得ずWebアプリケーション側で対応する上で、まだ定番となる対策がないように思えます。このため、複数の候補を示することで議論のきっかけにしたいと思います。 まず、作りながら基礎から学ぶPHPによるWebアプリケーション入門XAMPP/jQuery/HTML5で作るイマドキのWeから、Ajaxを利用したアプリケーションの概念図を引用します（同書P20の図1-23）。 前回、前々回は、(5)のHTTPレスポンスの前後で、JSON等のデータ作成（エンコード）に起因するevalインジェクションや、(5)のレスポンスを受け取った後のHTMLレンダリングの際のXSSについて説明しました。 しかし、問題はこれだけではありません。正常
JavaScriptの誤動作も - Internet Explorer 9の実力：ITpro いろいろ酷かったのでdisっておく。 例がダメ まず、1ページ目の『「非標準」の属性を参照できない』で、anchor要素に対してrel属性値を得るにはElement#getAttributeを使用しましょうという話。 まあ、この話自体はIE9の現状の仕様ってことで良いのだが、anchor要素のrel属性は旧HTMLでは「非標準」だったかもしれないが、HTML5ではきちんと定義がされている。よって現状ではIE9のバグとも言える実装となっている。（IE9を試す環境がないので試してないがHTML5としてマークアップするときちんと取れたりするかも？） 将来的に使用できると思われるのを例として出すのは妥当ではないと思う。 ECMAScript5は関係ないよ また、 このような修正がなぜ必要なのかを、前述のC
昨日の日記の続きで、Ajaxに固有なセキュリティ問題について検討します。タイトルはXSSとなっていますが、今回紹介する脆弱性はXSSではありません。 作りながら基礎から学ぶPHPによるWebアプリケーション入門XAMPP/jQuery/HTML5で作るイマドキのWeから、Ajaxを利用したアプリケーションの概念図を引用します（本書P20の図1-23）。 Ajaxのアプリケーションでは、XMLHttpRequestメソッド等でデータを要求し、サーバーはXML、JSON、タブ区切り文字列など適当な形式で返します。ブラウザ側JavaScriptでは、データ形式をデコードして、さまざまな処理の後、HTMLとして表示します。以下に、Ajaxのリクエストがサーバーに届いた後の処理の流れを説明します。 サーバー側でデータを作成、取得 データ伝送用の形式（XML、JSON、タブ区切り文字列等）にエンコード
このエントリでは、あるPHPの入門書を題材として、Ajaxアプリケーションの脆弱性について検討します。全3回となる予定です。 このエントリを書いたきっかけ twitterからタレコミをちょうだいして、作りながら基礎から学ぶPHPによるWebアプリケーション入門XAMPP/jQuery/HTML5で作るイマドキのWeという本を読みました。所感は以下の通りです。 タレコミ氏の主張のように、本書はセキュリティを一切考慮していない 主な脆弱性は、XSS、SQLインジェクション、任意のサーバーサイド・スクリプト実行（アップロード経由）、メールヘッダインジェクション等 脆弱性以前の問題としてサンプルスクリプトの品質が低い。デバッグしないと動かないスクリプトが多数あった 上記に関連して、流用元のソースやデバッグ用のalertなどがコメントとして残っていて痛々しい 今時この水準はないわーと思いました。以前
追記 たくさん反響があって驚きました。念の為書いておくと、私はこの記事で仕組みを解説しただけで、このようなノウハウに賛成も反対もしていません。追記はここまで。 azu さんのつぶやきで知った、Dangers of anonymous function closures が、例がよいのに説明が少ないので、ここで丁寧に解説します。なぜ、 jQuery で ;(function () ...とセミコロンで始めるコードがあるのかがわかります。 次のサンプルの実行結果を想像して下さい。 var foo = function(bar) { console.log("foo"); return bar; } (function(){ console.log("bar") })(); 結果は "foo bar" を印字します。多くの場合、これは意図しない挙動だと思います。"bar" だけだと思いませんか。
知ってて当然？初級者のためのJavaScriptで使う即時関数(function(){...})()の全て - 三等兵 はてなブックマーク - 知ってて当然？初級者のためのJavaScriptで使う即時関数(function(){...})()の全て - 三等兵 知ってて当然？初級者のためのJavaScriptで使う即時関数(function(){...})()の全て - 三等兵の記事を読んだ後に当記事を読むこと推奨。 ブックマークコメントを見ていて、用語の使い分けが気になったので書いておこうと思う。 無名関数かクロージャーが一般的じゃないのか?即実効関数とか使い捨て関数なんて初めて聞いた。 「即時関数」を言い表したいときに「匿名関数」とか「クロージャー」というのは不相応。 「匿名関数」 これは単に名前の付いていない関数を表す言葉であって、定義後に即実行する関数を指すとは限らない。また、記
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
