JavaScript,jQueryの爆速コーディング、デバッグ方法論の勧め～実践向け逆引き(windows,chrome向け)～ - Qiita
※2017/4/21にオンロード時のデバッグ方法8を追記しました！ こんにちは！エイチーム引越し侍の加藤です！ みなさんJavaScript書いてますか？ console.logめっちゃ使うよねーって人は目からうろこのデバッグ方法を、 ケース毎に紹介していこうと思います。(僕はconsole.log使いません) サーバーにデバッグ用のコードをアップロードすること無いので、 消さずに意図に反してリリースしてしまう危険性がないのもお勧めです。 前提知識 F12で出てくるデベロッパーツール(Elements, Console, Source, Network)の知識 Ctrl+Shift+Fで外部ソース(js,css)に対して一括検索ができる HTML、CSSはElementsから直接修正⇒確認ができる jsはSourceから直接修正できる(Ctrl+Sで保存したらその状態で実行できる) jsは
JavaScript 言語概要 - JavaScript | MDN
JavaScriptチュートリアルBeginner's tutorialsYour first website: Adding interactivityDynamic scripting with JavaScriptJavaScript frameworks and librariesJavaScript ガイド入門編文法とデータ型制御フローとエラー処理ループとイテレーター関数式と演算子Numbers and stringsRepresenting dates & times正規表現インデックス付きコレクションキー付きコレクションオブジェクトを利用するクラスの使用プロミスの使用JavaScript 型付き配列イテレーターとジェネレーターInternationalizationJavaScript モジュール中級編Advanced JavaScript objectsAsynchrono
第1回 JavaScriptの基礎を見直す | gihyo.jp
連載のはじめに みなさんこんにちは、今回より「聞いたら一生の宝、プログラミングの基礎の基礎」 の連載を担当させていただく本橋佑介です。 本記事では、広く利用されている技術から新しい技術まで、基本的な部分を現場のエンジニアの声を取り上げつつ解説していきます。習得している方にとっては振り返りとなり、また今から学ぶ方にとっては同じ疑問にぶつかった方の意見が参考になれば幸いです。 現場のエンジニアの声は私が開発に携わっている技術系QAサイトteratailから抜粋しています。 第1回では、現在では様々な環境で利用されているJavaScriptの基礎をteratailの初心者投稿とともに振り返っていきます。 JavaScript JavaScriptは主にウェブブラウザを実行環境とし、動的なウェブサイト構築などに利用されてきました。 また、今ではNode.jsをサーバサイドで利用することが増え、
Ｊａｖａｓｃｒｉｐｔ→ＰＨＰに値の渡し方について - OKWAVE
こんにちは。 例えばですが <script type="text/javascript"> var count = 0; function calc() { count ++; } function regist() { document.frmRegist.count.value = count; document.frmRegist.submit(); } </script> <form name="frmRegist" action="DB登録.php" method="post"> <input type="hidden" name="count" value=""> </form> <input type="button" value="countを加算" onclick="calc();"> <input type="button" value="計算結果を送信" onclic
「ノンプログラマーのためのjQuery入門」のスライドが凄く分かりやすいですね - かちびと.net
この記事は年以上前に書かれたもので、内容が古かったり、セキュリティ上の問題等の理由でリンクが解除されている可能性があります。 Twitterに流れてきたスライドがとっても 分かりやすかったのでブログでより多く の方に拡散。ノンプログラマー向けの jQueryの基本講座。これからjQuery を使おう、という方は読んでおくと良さ そうですね。 ノンプログラマー向けにjQueryの基礎をスライド化してくれています。 @pocotan001さん作のスライドです。 このスライドを見ながらコーディングする、というより、基礎知識を頭に入れるのに適したスライドだと思いますので気軽にご覧になってみて下さい。ハードルがかなり下がると思います。 また、当ブログでもjQueryプラグイン等の情報を取りあえげていますので合わせてどうぞ。 jQueryのリファレンスサイトと入門書籍 [2011.09.21アップデー
ASP.NET AJAX 4.0を予習する（前編）
ASP.NET AJAXには次のような特徴があります。 ASP.NETのポストバックモデル開発をそのまま利用したAJAX開発 Extenderによる既存コントロールの拡張 Microsoft AJAX Libraryによるクライアントスクリプトの拡張 ASP.NET WebServiceとの簡単な連携 ASP.NET AJAX Control ToolkitによるExtenderの提供 この中でASP.NET AJAX Control Toolkitはオープンソースプロジェクトからの提供となるため、純粋にはASP.NET AJAXの特徴とはいえませんがAJAX開発の際には非常に重要なライブラリ群です。 ASP.NET AJAXはこれらの特徴により既存のASP.NETの開発手法を崩すことなく、ASP.NETのページをAJAXに対応したインタラクティブなものに変更することができました。 ASP
本気でやるならonclick属性は避けてライブラリを活用すべき - id:HolyGrailとid:HoryGrailの区別がつかない日記
第1回 そろそろ本気で学びませんか？ | Think IT これ、今この記事書いてる時点で650以上ものブクマがされているんだけれども、あまり内容がよろしくない。 というのも、解説はとても丁寧ですごくよい内容なのだけど、サンプルコードの書き方がどうも古くさい。 onclick属性とか、今時のフロントエンドエンジニアはそんな書き方はしない（と思う）。 なぜonclickをあまり推奨しないのか やっぱり、エンジニアとデザイナーorマークアッパーとの分業の点でHTMLの属性にスクリプトを書いちゃうのはあんまりよろしくない。 たとえばの話だけど関数の名前を変えたかったり、だとか、HTMLを変更したり、っていうときにミスが起こりやすくなってしまう。 これは分業していなくてもどちらにしろ発生してしまうことだと思う。 他にも前に書いたのだけど、aタグとかでonclickしちゃうとhrefにreturn
ベンチ、文字列の連結、繰り返し - FAX
JavaScript malaさんからコメント頂きました。 連結する文字列の長さによると思います。巨大な文字列を+=で連結すると特にIEでかなり遅くなります。[a,b,c].join("")とかstr.push(a,b,c)とか、メソッドの呼び出し回数を減らすようにすれば殆ど多くのケースでArray#push+joinの方が早いと思います。 そうか！なんか自分でArray#push&joinを使うと遅いのに、みんなそっちが速いといってるのは、str.push(a,b,c)で一度に詰めるからなんですね。でもループの中で一個ずつ詰めていったり、ちょこっとした文字列だったり、アプリケーションのメインターゲットのブラウザがFirefoxだったり、やっぱり状況によって利用すべきテクニックは結構違うのかなぁと思います(負け惜しみ)。Firefoxは、str[4]みたいにキャラクターを取れるところとか、
Javascript（script.aculo.us）で、ブログをアニメーション・デザイン：Goodpic
This shop will be powered by Are you the store owner? Log in here
submit ボタン disable 技の罠 - naoyaのはてなダイアリー
昨日のonsubmit で submit ボタンを disable にしてユーザビリティを良くするにはちょっとした罠があって、それに気付かずに使うとはまってしまうかもしれないので、それもちょっと書いておく、というか今日僕自身がはまったわけだが。 罠というのは、type="submit" な input 要素、つまりは submit ボタンを onsubmit ハンドラで disable するまでは良いのですが、このとき <input type="submit" name="foo" value="bar">としていて、foo=bar という値が渡ってくることを期待し、それを内部の処理に使っていると嫌な目に逢う、という話です。先のやり方では input 要素が disable になって GET なり POST なりされるので、押したボタンに対応するパラメータが渡ってこない、というわけです。一
JavaScriptを使ってクライアントのOSに応じた処理を行う：CodeZine
はじめに ブラウザの種類やバージョン、各々のブラウザ独自の実装の違いを考慮して、同じように動作するスクリプトを、「クロスブラウザスクリプト」と言います。クロスブラウザスクリプトを実現するためのテクニックの一つに、スクリプトが実行されているブラウザの種類を判断し、そのブラウザに合わせたスクリプトを実行する、という方法があります。このテクニックを利用すると、ブラウザの違いだけでなく、ブラウザを実行しているOSの違いを、ある程度判断することも可能です。 ブラウザの見栄えは、OSの違いによって変わる場合があります。代表的な例として、例えば、WindowsとMacintoshのディスプレイの明度の違いがあげられるでしょう。ディスプレイの設定が標準状態の場合、Windowsの方がMacintoshと比べて、明度が低いため、同じ写真や画像を表示しても、Windowsの方が、Macintoshより暗く表示
CodeZine：プロトタイプ（prototype）によるJavaScriptのオブジェクト指向（プロトタイプ, オブジェクト, Javascript, ECMASCript）
はじめに JavaScriptはオブジェクト指向言語です。しかし、そのオブジェクトの性質は、他に良く知られているオブジェクト指向言語のJavaやC++と大きく異なっています。 そこでこの記事では、なぜそのような違いがあるのか、JavaScriptにおけるオブジェクト指向の言語思想を見ていくと共に、その違いの根幹であるプロトタイプについて解説していきたいと思います。 なお、この記事はJavaScriptの解説ですが、その内容は、標準仕様のECMAScriptで扱われる範囲に基づいています。従って、同じくECMAScriptを元にしている言語（JScript、ActionScript）でも通じる内容になっています。 対象読者 プログラミングの基本的な知識、ならびにオブジェクトやメソッドと言った基礎的な概念については、ここでは解説しません。最低限、オブジェクト指向プログラミングについて
オブジェクト指向プログラム言語としてのJavaScript
このページでは、JavaScriptのオブジェクト指向言語としての側面を研究します。 JavaScriptは、HTMLの拡張という側面が注目されていますが、 プログラム言語として見た場合にも、興味深い独自の特徴がたくさんあります。 このページでは、これらJavaScriptの言語としての特性、 特にオブジェクト指向言語としてJavaScript を見た場合の特徴について詳しく研究を試みます。 JavaScriptは、ほぼ完全なオブジェクト指向言語です。プログラマによるクラス定義、プロパティ定義、メソッド定義ができます。継承は、言語の基本機能としては用意されていませんが、基本機能の組み合わせにより実現できます。 メソッドのバインディング(binding)はレイトバインディング（late binding）です。これは、JavaScriptが変数の型のない言語だからです。 JavaScriptに
JavaScriptの関数とメソッド：CodeZine
はじめに JavaScriptはオブジェクト指向言語です。しかし利便性のために、C言語などと同じようにグローバルな関数を定義し、構造化的な手法でプログラミングすることも可能です。 この記事では、JavaScriptにおける関数の基本的な性質を見ていくと共に、関数の正体、および関数の使用方法について解説していきたいと思います。 なお、この記事はJavaScriptの解説ですが、その内容は、標準仕様のECMAScriptで扱われる範囲に基づいています。従って、同じくECMAScriptを元にしている言語（JScript、ActionScript）でも通じる内容になっています。 対象読者 プログラミングの基本的な知識、ならびにオブジェクトやメソッドと言った基礎的な概念については、ここでは解説しません。最低限、オブジェクト指向プログラミングについて理解をしている人を対象としています。
CodeZine：JavaScriptにおけるオブジェクトの基本的性質
はじめに JavaScriptはオブジェクト指向言語です。従って、そのプログラミングは、オブジェクトの生成やプロパティの参照、メソッドの実行などを組み合わせる作業と言えます。つまり、オブジェクトを上手く扱うことができなければ、JavaScriptの良いコードは書けません。また、JavaScriptにおけるオブジェクトの考え方は、JavaやC++とは根本的に違っています。 そこで、この記事では、JavaScriptにおけるオブジェクトの基本的な性質について見ていくと共に、JavaやC++といった他のオブジェクト指向言語との違い、JavaScriptにおけるオブジェクトの扱い方などを解説していきたいと思います。 なお、この記事はJavaScriptの解説ですが、その内容は、標準仕様のECMAScriptで扱われる範囲に基づいています。従って、同じくECMAScriptを元にしている言語（
最適JavaScript
文字列 置換処理 - JavaScriptで置換処理 文字列を配列化 - 文字列を指定した文字で配列化処理 ウイルスメール対策 - メールアドレスを崩しウイルスを駆除 URLチェック - URL(Mail・Comment)が正しいかどうかチェック 数値 金種計算 - 入力された値に対して最適な金額の枚数を求める 10進数をX進数に変換 - 10進数をX進数に変換 数値のグラフ化 - 入力された数値からグラフを作成する 最大値・最小値・平均 - 入力された数値から最大値・最小値・平均を求める グループトータル - 商品別のグループトータル ソート 基本交換法 - 基本交換法を利用してあいうえお順にソート 順位付け - 基本挿入法の原理を利用して順位を付ける 探索処理 直接探索 - 入力されたデータが配列の添え字を表す場合の探索方法 逐次探索 - 配列を順番に比較しながら探索する方法 区間探索
ブラウザによるイベントの取り扱いの違いを吸収する：CodeZine
はじめに JavaScriptは、本来スクリプトコードを一つ書けば、JavaScriptに対応したブラウザであれば、どのブラウザでも同じように動くはずです。しかし、現実にはそう簡単に行かず、あるブラウザではスクリプトが動くのに、別のブラウザではうまく動かない、といった事態がよく発生します。 これは、ブラウザのバージョンによって、サポートしているJavaScriptのバージョンに違いがあったり、たとえ同じバージョンのJavaScriptをサポートしていても、ブラウザごとにJavaScriptの実装に微妙な違いがあったりするためです。 このような、ブラウザの種類やバージョン、各々のブラウザ独自の実装の違いを考慮して、同じように動作するスクリプトを、クロスブラウザスクリプトと言います。クロスブラウザスクリプトを作るのには、ちょっとしたテクニックが必要となります。しかし、いったんテクニックを
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
サバクラ両方で動く JavaScript の大規模開発を行うために
IDEA * IDEA
night.nu