Bookmarklet - ブックマークレットを作成する際のポイント
Updated: 2003-09-28 05:44:07+0900 [Home] 値を返してはいけない 値を返す式を使うとページを移動してしまいます。 javascript:contents='aaa' これならOK javascript:void(contents='aaa') 変数はページ内でグローバルになってしまう varをつけても、ブックマークレットで使用した変数は、ページ内でグローバルになってしまいます。表示中のページの動作や、他のブックマークレットの動作を変えてしまう可能性があります。 javascript:var contents='abc' javascript:var contents='123' 上のリンクをクリックしたあと、以下をクリックするとcontentsの中身が変わっているのが見えます。 javascript:alert(contents) これはページに書かれ
eigokun on Twitter: "JavaScript 書いてるのは全員チャラ男"
JavaScript 書いてるのは全員チャラ男
JavaScript基礎文法最速マスター - gifnksmの雑多なメモ
続々と増え続ける基礎文法最速マスターシリーズ(あまりにも増えてきたので他の言語記事へのリンクは別の記事に移しました)。 JavaScript 版は誰も書いていなかったようなので書いてみます。こういう解説記事的なものを書くのは初めてなので変なところがあったら指摘して頂けるとありがたいです。 JavaScriptの基礎概念についての解説はこちら：JavaScript基本概念最速マスター - TechTalkManiacs 1/31 23:58追記 コメント欄のos0xさんのご指摘を基に一部追記・修正を行いました。 2/2 2:52追記 switch文・正規表現・例外処理について追加しました。 2/2 6:44追記 コメントでfavrilさんにご指摘頂いた点(typo & コメント・サンプル追加)を修正・加筆しました。 2/2 7:15追記 トラックバックでLiosKさんにご指摘頂いた点(cal
JavaScriptのnewって本当にいらない子？ - あと味
先日、「JavaScriptのオブジェクトについて考察してみた - あと味」を書いてから、chikuraさんからコメントいただいたり、id:dankogaiさんから「404 Blog Not Found:javascript - にはクラスはない」という記事で言及いただいたり、JavaScript: The Good Partsを読み返したりした結果、newについて調べたいという衝動にかられましたので、その調べた結果を書いてみたいと思います。 newを調べようと思ったキッカケを整理 まずは、そのキッカケから整理します。 chikuraさんのコメントより 押さえるべきポイントは、new演算子の際に何が行われるか？だと思うので、こちらのページもぜひ読んでみてください。 JavaScript の new 演算子の意味: Days on the Moon http://nanto.asablo.j
JavaScript の不思議な面白さ - 第三回
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog 「第二回」では、グレー文字入り入力欄という課題への解答例としました。 プログラムの設計といったものがどんなものなのか、その面白さが少しでも伝わっていれば幸いです。 とはいえ、動いてさえいればあとはどれも似たようなもので、あとはプログラマの自己満足の世界です。その中での創意工夫はプログラマに閉じた世界とはいえ、ポケットの中に広がった空ではないかと思っています。 前回の最後の問題の答えを示す前に一つ重要なことを忘れていました。 そうです、使ってもらう為にはライブラリ化が必要でした。 ＊ 三回目となるこの記事からは、皆さんお待ちかねの関数化・ライブラリ化といったプログラムを隠す手法を試していこうと思います。ロジックの複雑化や高機能化につ
javascript - クリックジャック殺しなbookmarklet : 404 Blog Not Found
2009年03月05日02:30 カテゴリLightweight Languages javascript - クリックジャック殺しなbookmarklet 意外な盲点。 主要ブラウザすべてに影響する「クリックジャッキング」攻撃とは しかし、 クリックジャック - 素人がプログラミングを勉強するブログ FirefoxユーザはNoScriptを使うか、about:configからpermissions.default.subdocumentを3にしましょう。 というのはあまりに厳しく悲しい。対策しようは果たしてないのでしょうか？ その結果が、こちら。 clickUnJack javascript:(function(d,u){var s=d.createElement('script');s.charset='UTF-8';s.src=u;d.body.appendChild(s)})(do
JavaScript の不思議な面白さ - 第二回
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog 前回の記事「JavaScript の不思議な面白さ」はお楽しみいただけたでしょうか？ 一例として正攻法で突入していった例については賛否両論あるようです。確かに結果としてできたプログラムは見た目にも美しくなく、目を覆いたくなるばかりでした。 今回は解答編として JavaScript ならではといえる "奇妙な" 例をひとつお見せしたいと思います。ヒントは前回もちらっとお話させていただいたものです。 コード改善に向かって その前に前回の問題はなんだったのかをプログラマ視点で見ていきます。 コードが美しくないと感じるのはなぜでしょうか？ 改善するならどうすればよいのでしょうか？ ひとつの方法は "隠す" ことです。関数化・クラス化・ライ
JavaScriptをこれから学習する人へ - 書籍編 - VTuberになったプログラマーの魂の残滓
分かりやすく言うとアサマシエントリです。 今回は書籍編としているのは、ちゃんと後日「エントリ」編を書くつもりだからです。 どういうことか、っていうと「まとめ」エントリですね。 JavaScript 第5版 JavaScript 第5版posted with amazlet at 08.07.14David Flanagan オライリー・ジャパン 売り上げランキング: 49481 Amazon.co.jp で詳細を見る まずは鉄板の書籍、通称「サイ本」です。 言語仕様について詳しくかかれており、本気で勉強する人であれば、まず斜め読みでいいので、一度読んでみましょう。 その後は手元に置いておき必要なときに参照できるようにしておきましょう。 JavaScript & DHTMLクックブック 第2版 Webエキスパート必携テクニック集 JavaScript & DHTMLクックブック 第2版 We
エンジニアの勉強法について
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは。 サービス統括部に所属しております、堀 邦明と申します。 普段はYahoo! JAPANトップページのフロントエンドエンジニアとして、JavaScriptやPHP,Perlといった言語を利用して開発しています。 この度、デベロッパーズサミット2009というイベントにおいてエンジニアの勉強法というテーマでJavaScriptの勉強法についてお話をさせていただきました。 今回は、そのときのお話について発表しきれなかった部分も含めてご紹介できればと思います。 勉強の分類 勉強には大きく分類して2つのステップがあると思います。 1. 情報収集 1つは情報収集です。 技術書やウェブサイト、ブログを読んだり、勉強会やセミナーに参加
JavaScript の不思議な面白さ
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog JavaScript と言うと普段自信をもって膨大なプログラムと格闘している諸氏もコード断片のはり付けに終始してしまうことも多いのではないでしょうか。かくいう私も検索エンジン（を使ってコードを書く）プログラマになっていることが多々あります。 JavaScript にあるこのプログラムの自作を妨げるのは、ブラウザごとに仕様が違ったりとか、正しいはずのコードが動作しなかったりと、プログラミング言語としての特殊性が挙げられると思います。特に目的実現の為に必要となる発想は他の言語と一線を画します。 今回は、 題材は、これです。 誰でも一度は使ったことがあるだろう灰色の説明文付きの入力欄ですね。 簡単な例 さて、作ってみましょう、ということ
javascript - ソースを見せてかつ動かすための３つのtips : 404 Blog Not Found
2009年02月24日04:30 カテゴリLightweight LanguagesTips javascript - ソースを見せてかつ動かすための３つのtips livedoor Blogを私が愛用しつづけている理由のひとつが、JavaScriptを受け付けること。 おかげでかなりのentriesが溜まりましたが、それだけにで実行用のソースと表示用のソースを用意するのが人一倍おっくうに感じられます。そんなわけで、どうやれば怠慢をもっと発揮できるかをまとめてみました。 0. DOMにIDをふらずにデモる こんな感じのデモがあったとしましょう。「404 Blog Not Found:javascript - Array#sortがオレquicksortより遅い!?」にあるものを書き直したものです。 # of Items: よくあるのは、inputタグやpreタグにIDをふって、docume
東京を走る路線のデータを使って、最短経路問題をダイクストラ法で解く - imHo
ダイクストラ法が小さなサンプルデータで動いたら、実際のデータを使ってみたくなるのが人情。東京を走る地下鉄のデータでやってみたいと思った。 JavaScriptとPrototype.jsとGoogleMapsAPIとすったもんだしたあげく、なんとか動くものができた。 502 Bad Gateway テストアプリはこちら JavaScriptのソースはここのhtmlに 駅や路線のデータは駅データ．ｊｐのものを使わせてもらいました。 使ったのは東京メトロ＋都営＋山手線 駅（ノード）の数は、同じ駅でも路線ごとで別にカウントして 322 駅同士をつなぐ線路（エッジ）の数は、徒歩や乗換えを含め 912 体感もっさり感じるけど、経路の検索以外のところがかなりかかってる Tips Prototype.js Array.without は超重い、使うな！ Hash.keys で返ってくるキーはすべて文字列に
JavaScript でのブラウザ判別 - 「仕様の盲点」ではなく、「プロパティの有無」を使う方がマシ - 2009年2月 - Blog - EOF
IE6, IE7 で tabindex 属性を JavaScript 側から設定する時の注意 これは完全にバグといえる仕様なのだが、IE6 と IE7 では JavaScript（IE だから本来は JScript）側から setAttribute などを使って tabindex 属性を設定してやる時、属性名を "tabIndex" にしてやらないと認識しないことを知った（"I" がキャメルケースになっている）。WAI-ARIA（2008-08-06版 WD 邦訳）絡みで色々といじっていた時に発見。因みに IE8 RC1 では修正されている。 次の JavaScript コード断片は、IE で tabindex 属性を設定する時の方法を説明したものである。 // ターゲット要素 var elem = document.getElementById("test"); elem.setAttr
SpiderMonkey の判別とブラウザ判別: Days on the Moon
1 行でブラウザ判別を行うスクリプト (IE 用の日本語紹介記事、Firefox、Safari 用の日本語紹介記事) が注目を集めています。それによると Firefox の判別は次の 15 文字で行えるそうです。 //Firefox detector 2/3 by DoctorDan FF=/a/[-1]=='a' いったいなぜこれで Firefox が判別できるのか、少し探ってみました。 何を判別しているのか SpiderMonkey のソースコードを探る より短い SpiderMonkey の判別法 「ブラウザ判別」としての不備 まとめ 参考文献 何を判別しているのか 実際に探っていく前にひとつ注意しなければいけないことがあります。それは、上記のコードが Firefox を判別するものではないということです。このコードには Web ブラウザ固有のオブジェクトモデルに関する情報が含まれて
MooseにインスパイアされたJavaScript向けオブジェクトシステム·Joose MOONGIFT
すでに半年以上昔ではあるが、Perlの新しいオブジェクトシステムとしてMooseに注目が集まった。面倒なオブジェクト定義が手軽に、さらに型指定なども容易にできるのでオブジェクト指向プログラミングが簡単になる、というライブラリだ。 デモアプリケーションのblok。MS Visio風なドローアプリケーション コーディング量が減り、可読性が高まればバグの入り込む余地が減るので、システムの品質が高まる。工数も下がるし、メンテナンスもしやすいと言った具合に文句なしに良い。そんなMooseにインスパイアされたのがJooseだ。 今回紹介するオープンソース・ソフトウェアはJoose、JavaScript版Mooseだ。 JooseではMoose同様にオブジェクトを定義することができる。hasを使って属性を定義すれば、セッター/ゲッターは自動的に生成される。さらにメソッドの追加も簡単にできる。もちろん、属
JavaScriptでCAPTCHA破り·Megaupload auto-fill captcha MOONGIFT
汎用的なものではないが、技術的には非常に興味深い代物だ。Webサイトではロボットによるクローリングを防止するためにCAPTCHAと呼ばれる仕組みを導入していることがよくある。ぐにゃぐにゃな文字で、人であれば読めるがコンピュータには読めないであろう文字を表示して人かロボットかを判別するのだ。 上に表示されている画像を解析して文字として表示するデモ だがただ文字を画像化したくらいではOCRのような仕組みを使って読まれる可能性がある。それを示したのがMegaupload auto-fill captchaだ。 今回紹介するフリーウェアはMegaupload auto-fill captcha、MegauploadのCAPTCHAを破るGreasemonkeyだ。ソースコードは開示されているがライセンスは明記されていなかったのでご注意いただきたい。 Megaupload auto-fill cap
JavaScript によるユーザエージェント判別
UAIdentifier - JavaScript によるユーザエージェント判別 © 2006-2007 Magicant / 1.9.2 (2007-02-02) JavaScript を実行しているブラウザの種類およびそのレンダリングエンジン・オペレーティングシステムの種類を判別します。 テストページで実際に試すことができます。 uai.js は自由に使用していただいて構いません。 目次 uai.js の使い方 uai.js の API 仕様 UAIdentifier コンストラクタ toString メソッド 各プロパティ 判別機能の詳細 判定結果の使い方 uai.js の使い方 実装ファイルは uai.js です。 このファイルは単独では実行しても意味がありません。 uai.js には UAIdentifier オブジェクトの定義が含まれ
Google Chrome ではてなスターコメントの出現位置がおかしい件とその原因 - IT戦記
Google Chrome ではてなスターコメントの出現位置がおかしい こんな感じ 原因は Ten.js の以下の箇所 getMousePosition: function(pos) { // pos should have clientX, clientY same as mouse event if ((navigator.userAgent.indexOf('Safari') > -1) && (navigator.userAgent.indexOf('Version/') < 0)) { return { x: pos.clientX, y: pos.clientY }; } else { var scroll = Ten.Geometry.getScroll(); return { x: pos.clientX + scroll.x, y: pos.clientY + scrol
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
HTML、CSS、JavaScriptの練習に最適な便利ツール『rendur』 - 100SHIKI ～ 世界のアイデアを日替わりで ～
JavaScript Rock Star