http://plus.appgiga.jp/masatolan/2014/03/21/51257/
IE9とIE10のJavaScriptでの違い - Humanity
基本あまりなくて、色んなサイトで「IE10はIE9の機能追加版」みたいに言われてたけど、 機能追加だけじゃなく、仕様変更の部分もちらほらあるみたいだった。 今の所見つけたのは以下の2点。 this.documentがundefinedになる window.open()の挙動がちょっと違う(未検証) this.documentがundefinedになる ちなみにthis.documentとwindow.documentの違いは、 window.open()で開いたウインドウに対する イベントハンドラー内で参照した場合に違いが出る。 javascriptのDOMスクリプティングにて、「this」を使うケースとして、イベントリスナー内の処理があります。 下記の例で、thisを省いてしまうとobj1とobj2の内容が同じになってしまいます。 //ウインドウ１の処理 var obj1 = docum
JavaScriptでモーダルウィンドウを出すなら｜TechRacho（テックラッチョ）〜エンジニアの「？」を「！」に〜｜BPS株式会社
初めまして、2月にBPS株式会社に入社しましたikedaです。techrachoに投稿するのも初めてになりますがよろしくお願いします。今回は画像をクリックしたらモーダルウィンドウを出す方法について書きたいと思います。 参考サイト http://www.jacklmoore.com/colorbox/ https://github.com/jackmoore/colorbox 公式にも書かれていますが、colorboxは画像のグルーピングとスライドなどを簡易的に実装できるjQuery pluginです。サンプルコードなどものっているのでこちらを参考にして実装すると良いと思います。 自分もinlineで利用するモーダルウィンドウに画像と文を出すサンプルコードを書いてみました。 * imgタグのsrcは適宜置き換えてください。 <!DOCTYPE html> <head> <meta chars
JavaScriptの動かないコード (JavaScriptエラー集) - 主に言語とシステム開発に関して
「このJavaScriptコードが動かないのは，なぜですか？」というミニクイズ集。 すべて制限時間は１分。 別名，JavaScriptのエラー事典。またはアンチパターンのまとめ。 中級編 初級編 番外編 2015年５月現在，全５３記事。 中級編 JavaScriptの仕様関連 p要素への appendChild() で失敗する かけ算を間違える イベントハンドラが見る値のエラー クロージャを使わない場合に起きるエラー オブジェクトのprototypeを変更した時のエラー 正規表現で同じ文字の連続を検出したい - 置換前パターン中での後方参照 jsonオブジェクトをevalできないエラー 不要なイベントが連鎖で発生してしまう （バブリングの対処） オブジェクトのプロパティ定義にthisを使って失敗するエラー setTimeoutのタイマーが指定時刻に動かないエラー オブジェクトのメソッドを
JavaScriptのコーディングTips集 - 主に言語とシステム開発に関して
JavaScriptのプログラミングに関するTips集。 主に中級レベルの話題とノウハウを掲載する。 なお，JavaScript初級〜中級をクイズ形式で網羅的に学習するためには，下記のエントリを参照。 JavaScriptの動かないコード (JavaScriptエラー集) http://language-and-engineering.hatenablog.jp/entry/20080912/1221297779 ※JavaScript以外のプログラミングについては，こちらを参照。 ピュアJSを極める： JavaScriptで，クラスを継承する方法 （複数のサブクラスから共通クラスのプロトタイプを参照する） JavaScriptでの例外設計 （throw，try-catch-finally構文のイメージと利用パターン） JavaScriptで，動的に追加されたイベントリスナの実行順序を保
JavaScript で throw "" ではなく throw new Error() を使ったほうがよい(些細な)理由 - latest log
JavaScript で人為的に例外を発生させるには、大きく分けると以下の2種類があります。 throw new しない書き方 throw "ソフトウェアでエラーが発生しました。サポート担当者に連絡し、この問題を報告してください。"; o_o は String 扱いで、o_o.stack も undefined になっています。 throw new する書き方 throw new Error("一般的なエラーだよ"); throw new TypeError("型がちがうよ"); throw new SyntaxError("文法おかしいよ"); throw new URIError("URIちがうよ"); 他にも、RangeError, ReferenceError, MediaError, FileError, EvalError などがあります。 throw new した場合は、o_
はじめてのJavaScript / JS Girls Tokyo #1
JS Girls Tokyo #1で、JavaScript初心者向けの勉強方法について話しました。 私自身、HTML/CSSはできてもJavaScriptが大の苦手でしたが、@hokaccha 先生による修行によって、なんとか理解できるようになりました。 その修業の中で、何をどうやって勉…
Object.observeについて - JS.next
概要 Object.observeとは、オブジェクトの変更を監視するためのAPIであった。 ES2015,2016の候補として挙げられており、V8でデフォルトで有効にされるまでに至っていたが、 実装コストがかかる上、世のニーズとそれほど合っていないということで結局廃止された。 改めて注意勧告 これは廃止された仕様です APIの概要 提供されるメソッド Object.observe(target, callback, acceptList = defaultAcceptTypes) // targetオブジェクトを監視する // 監視するオブジェクト、変更があった時に呼ばれる関数、監視するタイプの配列を指定する // defaultAcceptTypes = ['add', 'update', 'delete', 'setPrototype', // 'reconfigure', 'prev
あれ、いつも書いてるな～というJavaScript の小技集 | バシャログ。
いい加減髪を切りたいminamiです。 JavaScriptでいつも書いてるな～という処理や、知っていると便利なTipsを簡潔に集めた記事を見てほお～と思ったものがいくつもあったので抜粋してみました。 ※追記1： ご指摘がありましたので一部修正しました。「配列をソートする」ではなく「配列をシャッフルする」でした。 ※追記2：「HTMLをエスケープする」のソースがまちがって表示されていました。修正しました。 ※追記3：予想以上に反響が大きく、多数ご指摘を受けてしまいました。よく使う処理の書き方もいろいろあるんだな～という参考程度にご紹介したのですが、参照元の記事の内容の検証が不十分なまま紹介してしまい申し訳ありませんでした。いろいろと勉強になりました！ 45 Useful JavaScript Tips, Tricks and Best Practices 配列からランダムで値を取り出す v
JUnit(Java)でJavaScriptをテストする。 - Qiita
JUnit上でJavaScriptのテストを行う方法をご紹介します。 JavaScriptのfunctionも、テストしたい！ 画面を作るのはJavaScript、CSSで任せて、サーバサイドはデータのコントロールに専念するのが、最近のはやりのアーキテクチャのような気がしたり、しなかったり。 そんなこんなで、JavaScriptの重要性はますます上がって、JavaScriptがいろいろなロジックを持つことが多くなってきました。 だから、JavaScriptのfunctionも、テストしたい。 Javaなら、できる。JavaScriptのテスト。 Javaは、JavaScriptエンジンを持っているのです。JREに入っているので、別途テスト用にライブラリを取り込む必要はありません。 JUnit上でJavaScriptをテストしてみましょう。 テスト対象のJavaScriptは以下の様なコード
Java書けるんなら当然JavaScript呼び出せるよね？ - プログラマーの脳みそ
上司「Java書けるんなら当然JavaScript呼び出せるよね？さっさとやっておいて」 JavaからJavaScriptを呼び出す Java 6 からスクリプトAPIを通じてスクリプト言語を呼び出すことができる。Java標準でJavaScriptのエンジン Rhinoが組み込まれているので特にインストール作業やクラスパスを通すような作業なしにJavaScriptの呼び出しをすることができる。 import javax.script.*; public class Sample { public static void main(String[] args) throws ScriptException { ScriptEngineManager manager = new ScriptEngineManager(); ScriptEngine engine = manager.getEn
JavaScriptのテストコードをNode.js＋Jasmineで実行してみよう
対象読者 JavaScriptの基本をある程度理解している方 テストコードをこれから書こうと考えている方 Jasmineとは Jasmineとは、JavaScriptのテスティングフレームワークです。Mochaなどのテスティングフレームワークとは違い、値を評価するためのアサーションモジュールも内包されています。また、CoffeeScriptでの記述も可能です。 Jasmineは振る舞い駆動（BDD）の形式でテストを記述します。BDDは、作成する機能に期待する「振る舞い」を文章で記述していきます。言い換えると、顧客が望んでいるであろう「要求仕様」に近い形でテストを表現しながら、テストと実装を記述していく手法です。 リスト01は、Jasmineで記述した基本的なテストコードです。このコードを文章として日本語に直訳すると「【処理結果】が【期待する値】と同じでないと予測（expect）する」です。
JavaScript MVVMフレームワーク「JsViews」の概要
はじめに JsViewsはJsRenderのテンプレートに宣言型データバインドを追加するフレームワークです。これにより、MVVM（Model‐View‐ViewModel）パターンを簡単に実装できます。 対象読者 JavaScriptデータバインドフレームワークに興味のある方 WebアプリケーションにおけるMVVMパターンに興味のある方 JavaScript、jQueryの基本を理解している方 必要な環境と準備 以下のサイトから、jsviews.jsとjQueryをダウンロードしてください。 JsViewsはJsRenderの機能を拡張するjQueryのプラグインです。JsViewsのダウンロードページでjsviews.jsをダウンロードしてください。jsviews.jsには、JsRenderとJsViewsが含まれています。 JsRender（jsrender.js）とJsViews（j
fn.js - JavaScriptを関数型言語のスタイルで書く！ MOONGIFT
JavaScriptは関数型言語の特徴を取り入れていると思いますが、純粋な関数型言語ではありません。通常はオブジェクト言語としてプログラミングするかと思います。しかし今、そしてこれからのトレンドは関数型言語と言われています。 そこでJavaScriptでより関数型言語的なプログラミングを可能にするfn.jsを使ってみましょう。慣れるまでは戸惑うかも知れませんが、面白いプログラミングができそうです。 試し中。 fn.jsのインストール fn.jsはクライアント/サーバサイドの両方で利用できます。クライアントサイドの場合は単純に読み込むか、require.jsが使えます。 <script src="path/to/fn.js"></script> // または <script> require.config({ paths: { fn: 'path/to/fn' } }); define(['
Task.js
A very simple way to wait for asynchronius processes. @uupaa - 2014-02-14 JavaScript, Async, Idiom JavaScript は非同期処理の塊 XHR onload setTimeout postMessage addEventListener DOMContentLoaded 非同期プログラミングを支援するイディオムには、 Deferred, Promises, async, await, DOM Promise, Flow.js などがありますが… Task.js を導入すると、非同期処理やブラウザのサポート状況に悩まされず、 ロジックのコーディングに集中できます 非同期処理へのNeedsとWants 複数の非同期処理の完了を待ちたい ダウンロードの完了を待ちつつアニメーションしたい いくつか
2行追加するだけでWebサイトを高速化するInstantClick.io - atskimura-memo
Before visitors click on a link, they hover over that link. Between these two events, 200 ms to 300 ms usually pass by (test yourself here). 引用：InstantClick — JS library to make your website instant リンクにマウスオーバーしてからクリックするまでには200msから300msほど時間がかかるそうです。実際このテストページでクリックしてみるとMacのトラックパッドだとさらに遅く500msくらいかかってました。 InstantClick.ioはその間に裏でリンク先ページをロードして勝手にリンクをpjax化してしまうという高速化ライブラリです。 やってることはRails4のturbolinksと似てます
NightWatch - node製のSeleniumクライアント
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました おお、これは表示系のテストが容易になりそう！ Seleniumは多数のブラウザを操作してテストを自動化できます。RubyやJavaなど様々なプログラミング言語向けにソース出力が可能で、各言語で作られたシステムと組み合わせることができます。 そんなSeleniumをnodeと組み合わせて使えるのがNightWatchです。書き方も使い方も柔軟で、これはテスト以外の用途でも活躍しそうです。 まずはテストの書き方。次のようなコードになります。 module.exports = { "Demo test Google" : function (client) { client .url("http://www.google.com") .waitForElementVisible("bod
Disable Javascript Console in Browsers
Randomly found this interesting reading about how Facebook disable developer tools at StackOverflow. It turns out, it's actually possible to disable Javascript console using Javascript alone but with a caveat. It started with a recent Facebook scam, users are being convinced/guided to paste malicious codes into the Javascript console which will post SPAM or hack accounts. And now, Facebook is rand
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
mizchi / すべてのMVCを過去にする - Glide
JavaScriptやCSSを圧縮／軽量化できるサービス「Minifier」 | ライフハッカー・ジャパン
