JavaScriptを短く書くためのショートコード集
Posted: 2014.12.25 / Category: javascript 知っておくとちょっとだけコードが簡潔に書けるかもしれないショートコード集です。 小数点以下切り捨て 「Math.floor」で切り捨てですが、 Math.floor(12.6598); //12 数値の前に「~~」付けるだけでもできます。 ~~12.6598; //12 桁数の制御 「～e」に続く数字で桁数を制御できます。 1e1 //10 1e2 //100 1e3 //1000 1e4 //10000 1e5 //100000 2の累乗はシフト演算子 2の累乗は左シフト演算子（<<）でできます。 200 << 1; //400 200 << 2; //800 200 << 3; //1600 逆は右シフト演算子（>>）です。 200 >> 1; //100 200 >> 2; //50 200 >> 3
第12回 XMLHttpRequest入門 | gihyo.jp
こんにちは、太田です。前回はJSONPについて解説しました。今回は、XMLHttpRequestについて解説していきます。 XMLHttpRequestとは XMLHttpRequestはブラウザ上でサーバーとHTTP通信を行うためのAPIです。 名前にXMLが付いていますがXMLに限ったものではなく、HTTPリクエストを投げてテキスト形式かDOMノードでレスポンスを受け取る機能を持っています。 仕様としてはW3CよりXMLHttpRequestとして定義されており、2010年8月3日にCandidate Recommendation（勧告候補）となったばかりです。また、XMLHttpRequest Level 2の策定も進められています。 XMLHttpRequestの機能と特徴 前回のJSONPと比べると機能的には大きな違いはありません。ただ、スキーム、ドメイン、ポート（これをまとめて
ユーザーの体感速度を高めるためのJavaScriptチューニング（後編）
連載「Webサイト・アプリ高速化テクニック徹底解説」の第3回は、前回の「ユーザーの体感速度を高めるためのJavaScriptチューニング（前編）」の続きです。この後編では、「ユーザーの操作を阻害しない」方法についてJavaScriptのシングルスレッドやイベントループを交えて解説し、HTML5のWeb Workersについても紹介していきます。 前回は、ユーザーの体感速度を向上させるための方法として、3つのうち「ページを素早く表示する」と「ユーザーに素早くインタラクションを返す」を解説しました。今回は、最後の「ユーザーの操作を阻害しない」について詳しく解説していきます。 ユーザーの操作を阻害しない JavaScriptによる処理が重くなると、いつまでも画面が更新されなかったり、ユーザーの操作が止まってしまったりということがあります。止まっている時間が長すぎると、ブラウザから応答がないという
JavaScript とのつきあい方
## JavaScript とのつきあい方 ### ここがダメだよJavaScript ### http://goo.gl/ovgS7Z Created by Shogo Kawase ## 自己紹介 - 河瀨翔吾（SHOGO） - 株式会社アークスタイル CTO - twitter: [@shogogg](http://twitter.com/shogogg) - PHP, Java, **Scala**, JavaScript, **TypeScript** - Android - AngularJS - Play Framework ## 本日の内容 - JavaScript の抱える問題点 - その解決方法があったりなかったり ## 問題点-1 ### 名前 ## JavaScript の名前の由来 - 元々は **Mocha** という名前で開発されていた - ライバルが Jav
ホームページ制作なら渋谷のウェブ制作会社【スタイル】
【スタイル】は東京都渋谷区でホームページ制作を行うウェブ制作会社です。ウェブサイト制作、SEO対策、ウェブマーケティングなどを承っています。良質テンプレートでの格安ホームページ制作プランもあります。
JSDocコメント - Google JavaScript スタイルガイド - 日本語訳
#divclass(page_title){ &this_page() } 我々は&blanklink(C++ style for comments){http://google-styleguide.googlecode.com/svn/trunk/cppguide.xml#Comments}の考え方に従います。 全てのファイル、クラス、メソッド、プロパティに&blanklink(JSDoc){http://code.google.com/p/jsdoc-toolkit/}コメントが、適切な&link_anchor(jsdoc_tag_reference){タグ}と&link_anchor(js_type_language,pageid=17){データ型}を伴って記されるべきです。また名前から明白に判断できる場合を除き、プロパティ、メソッド、メソッドの引数、メソッドの戻り値を説明する文章
jQueryとは 何ができるのか | jQueryを俺の脳にインストール！
jQueryとは 何ができるのか というお話を この記事では書かせていただきます。 jQueryとは、簡単に言ってしまうとJavaScriptという プログラミング言語をより簡単に使う為のライブラリです。 つまり、一言でjQueryを説明するのであれば、 JavaScriptという言語を簡単に使える便利なやつ。です。 JavaScriptってなんだよ！って感じですよね（笑） JavaScriptの特徴を簡単に説明すると、 Webページに動きを付ける事が可能な言語です。 具体的には、画像をスライドさせたり （当サイトのトップページ画像のような） ページがロードされた後にポップアップを表示させたり、 クリックされた時に色を変えたり、大きさを変えたりと、 Webページが表示された後に動きを加えることが可能です。 HTMLやCSSで実現できないようなリッチなデザインに するための
[JavaScript] 猿でもわかるクロージャ超入門 ２ 関数の中の関数 - DQN起業日記
クロージャとは関数である。 ずばり言います。 クロージャとは、関数である まずココがポイント。 次に、たいていの場合、 クロージャとは関数の中の関数である これで、クロージャのことを３０％程度は理解したことになります。 だから、 「クロージャーって何？」 って誰かに聞かれたら、 「ああ、関数の中に書く関数のことでしょ」 って答えとけば、３０％ぐらい正解ということになります。(w Javascriptでは、関数の中に関数を書くことができます。 もうちょっと正確に言うと、関数の中で別の関数を定義することができます。 //関数の中で関数を定義 function outer(){ function inner(){ alert("hello"); } } ここで、関数innerを呼び出すにはどうしたらいいでしょうか？ 下記のコードをコピペして、デスクトップに.htmlファイルとして保存して、ブラウ
![[JavaScript] 猿でもわかるクロージャ超入門 ２ 関数の中の関数 - DQN起業日記](https://cdn-ak-scissors.b.st-hatena.com/image/square/8f7de7c0278993661a11fbc3637f96292ba773aa/height=288;version=1;width=512/http%3A%2F%2Fdqn.sakusakutto.jp%2Fimages%2Fkali.jpg)
jQueryでフォームの入力内容を自動チェックするJavaScript「vanadium」
フォームの入力内容を送信前にチェックすると有益な情報を得る可能性が高くなります。 またコンバージョン、ユーザビリティの向上にも役立つことができるでしょう。 今回はjQueryプラグイン「vanadium」を利用します。 sponsors 使用方法 vanadiumからvanadium.jsをjQueryからjquery.jsをダウンロードします。 <script type="text/javascript" src="jquery-1.3.2.js"></script> <script type="text/javascript" src="vanadium.js"></script> あとは内容に応じてclassを振っていけば完成です。 なお、スタイルは以下となります。 正しい場合：.vanadium-valid 間違っていた場合：.vanadium-invalid 細かい指定は以下のサ
JavaScriptプログラミング講座【エレメントについて（HTMLElement）】
<span>あいうえお</span> <div>かきくけこ</div> <img src="http://example.com/test.jpg">
javascriptでonClick属性をダイナミックに変更する « kawama.jp
あるリンクを１回しかクリックされたくない、つまりダブルクリックを防止したいというケースがあったので、調べてみたところこんな感じで実装できるのがわかりました。 document.getElementById("button").onclick = new Function("alert('連打しちゃいや～ん');"); これで動作を確認し、実装時には「new Function(“void(0);”)」に直しました。 ツール amazon商品情報ビューワー amazon商品画像ビューワー HTMLエンコード・デコード URLエンコード・デコード ツールいろいろ 旧コンテンツ 2005年4月以前のコンテンツ カテゴリー Mac (5) SEO (7) 技術関連 (576) Ajax,JavaScript (78) Apache (22) CSS (19) Flash,ActionScript (
HTML5のCanvasに描かれる「アートスクリプティング」とにかく美しいJavaScript表現のまとめ28個！
動くぞ！きれいだぞ！ ﾍ(･_･ﾍ) とにかく痩せたい、HTMLファイ部のほんだです。 jsdo.it、nakamap、Paberish、HTML5実力テストといった自社運営Webサービスの HTML5エンジニアを担当している者です。 jsdo.it、ユーザー数 5万人突破！ 手前味噌ですが、このたび弊社運営のHTML5コード共有コミュニティ「jsdo.it」が、 ユーザー数 5万人を突破しました！（わーい！） 今回の記事では、jsdo.itのユーザー5万人を記念して、 HTML5 Canvas に芸術的な動きを表現しているJavaScriptコード「アートスクリプティング」を特集します！ あまり一般的ではないようですが、「アートスクリプティング」という言葉でくくってみました。 Canvasアートスクリプティング特集！ 説明不要！ 気になったコードは是非のぞいてみてください！
javascript samples
アルファベットの大文字･小文字変換 文字列の一部を抜き出すsubstringの使い方 文字列の長さを調べるlengthの使い方 onFocus()とonChange()イベントハンドラの使用例 ステータスバーにメッセージを出す ステータスバーにメッセージを表示する(終わりがあるケース) ステータスバーにメッセージを表示する(終わりがないケース) ラジオボタンの使用例 チェックボックスがチェックされているかどうかを調べる アラートメッセージ チェックされているチェックボックスのNAMEと数を表示する チェックボックスを使った背景色変更例 チェックされたラジオボタンのVALUEを表示する ラジオボタンのname、length、valueを表示する デフォルトとチェックされたラジオボタンを調べる ロード/アンロードするときアラートを表示する セレクトフォームの例(JavaScriptは関係なし)
JavaScriptで高さを取得計算後、別の要素に指定
JavaScriptで高さを取得計算後、別の要素に指定 2012.05.27 制作 CodingJavascriptjQuery 0 先日、とあるサイトの改善デザインとコーディングをしました。 そのときにJavaScriptの書き方を調べたのですが、また使う機会があるかもしれないのでメモです。 改善したページはECサイトの購入画面で、商品のオプションを選択する画面です。 ブロック1からオプションを選び、ブロック2には選んだオプションが表示されます。ブロック3にはオプション金額の合計と、次のステップに進むボタンが入ってます。 オプション選択は下向きに選んでいくのに合計金額やボタンが上部にあります。 なのでオプション選択後、次のページに進むにはページ上部に戻らなければなりません。わかりにくいしめんどくさい。 いくつか案を出して、下図のように改善方法に決定ました。 ブロック3をスクロールに応じて
文頭表示と全文表示の切り替え。 - javascriptを始める。
出来上がりはこんな。 切り替え前↑ 切り替え後↓ 簡単な説明。 文字数が多いと画面の領域を多く使ってしまうので「文頭のみ」を表示させたい時などに使う。ボタンの切り替えで全文、文頭の双方が表示可能。 普通ならこんな手順で考える？ 1.まずは全文が表示されているだけの単純な画面を作ろう。（動かないボタン付き） 2.ロードされたとき、文頭だけ表示されていてほしいなー。（ボタンはまだ機能してない） 3.ボタンで切り替え出来るようにしたいなー。 4.これで一通り動くので、ボタン自体の文字を「本文表示」、「文頭表示」とボタン押すごとに切り替えたいなー。 説明とソース <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8" /> <title>文頭表示と全文表示の切り替え。</title> <style> //overflow:h
jQuery UI の toggle を使い、スライドするアニメーションで表示切替
実装例（サンプル）の動作について 「表示 / 非表示」ボタンをクリックすると、スライドするアニメーション動作で、カーキ色のボックスの表示/非表示を切り替える。 実装例のソースコード 読み込み 読み込み方は、2種類ある。パスは、それぞれ、アップロードした場所を指定する。 まとめて読み込む場合 <link rel="stylesheet" href="themes/base/jquery.ui.all.css"> <script type="text/javascript" src="jquery-1.4.2.js"></script> <script type="text/javascript" src="ui/jquery-ui-1.8.12.custom.min.js"></script> <link rel="stylesheet" href="themes/base/jquery.u
50のケーススタディで学ぶJavaScript 本当に使えるプロの技: Case6: 長い文章に対し文頭表示と全文表示を切り替える (P.75)
Tuesday, August 16, 2011 Case6: 長い文章に対し文頭表示と全文表示を切り替える (P.75) 文頭表示と全文表示を切り替える. <html> <head> <title>長い文章に対し文頭表示と全文表示を切り替える</title> <style type="text/css"> div#honbunPart { border-bottom:1px solid #000000; margin-bottom:5px; padding:5px; width:500px; } div.buntou-hyoji { overflow:hidden; height:70px; } </style> <script type="text/JavaScript"> // 全文を表示するための関数 function showZenbun() { var guid = null
table のチェックボックスをクリックしたときに行の背景色を変える
■HTML：例 <table> <tr> <td><input type="checkbox" id="test_0" name="test[]" class="test" value="mo1"></td> <td>TEST1</td> </tr> <tr> <td><input type="checkbox" id="test_1" name="test[]" class="test" value="mo1"></td> <td>TEST2</td> </tr> <tr> <td><input type="checkbox" id="test_2" name="test[]" class="test" value="mo1"></td> <td>TEST3</td> </tr> </table>■CSS：例 /* チェックボックスにチェックを入れた際の背景色 */ .tr-select
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://www.googleadservices.com/pagead/aclk?sa=L&ai=CnLDF06L7UNR_jb-QBa26gZgB5IrW4ALE8OCkMOytprZBEAEgq6nvAlDF5PnV-f____8BYInrxYT0E6ABhLzM8QPIAQKpAnDJ6y2v2Uc-qAMByAPdBKoEhAFP0Pg_enM4II5WhF49bSXsy4YHTd1uxXoEEYm-QPjZaa_r4vOlZSIpnukN9K_No2IdHykr35BpHAhmWLa9l6
jQueryことはじめ。 | Bamboo lath 日々の記録