ES6時代のJavaScript - クックパッド開発者ブログ
こんにちは会員事業部の丸山@h13i32maruです。 最近のWebフロントエンドの変化は非常に激しく、ちょっと目を離した間にどんどん新しいものが出てきますよね。そんな激しい変化の一つとしてES6という次期JavaScriptの仕様があります。このES6は現在策定中で、執筆時点ではDraft Rev31が公開されています。 JavaScriptはECMAScript(ECMA262)という仕様をもとに実装されています。 現在のモダンなWebブラウザはECMAScript 5.1th EditionをもとにしたJavaScript実行エンジンを搭載しています。 そして次のバージョンであるECMAScript 6th Editionが現在策定中で、略称としてES6という名前がよく使われます。 今回は、他の言語にはあってJavaScriptにも欲しいなと思っていた機能や、JavaScriptでよ
clickイベント：マウスがクリックされたとき
click イベントはマウスのカーソルが要素の上にある状態で、マウスが押されたあとで離された時に発生するイベントです。 onclick 属性または onclick プロパティに対してイベントハンドラを設定したり、 addEventListener メソッドの引数として click を指定してイベントリスナーを登録できます。ここでは JavaScript を使って click イベントが発生した場合の処理を記述する方法について解説します。
“use strict”（厳格モード）を使うべきか？｜もっこりJavaScript｜ANALOGIC（アナロジック）
変数の使用の単純化 withの使用の禁止 strictモードではwith文が使えなくなります。代替の手段としては、オブジェクトに短い名前の変数を割り当てて、その変数を用いて対応するプロパティにアクセスすることができます。 eval内で宣言された変数のスコープ 非strictモードでは、eval("var x ;")の様に、eval関数内で定義された変数のスコープは、evalが含まれるスコープ（関数、またはグローバルスコープ）まで広がりますが、strictモードでは、eval内で定義された変数を周囲のスコープに広げません。 単純名の削除の禁止 strict モードでは delete name を構文エラーにします evalおよびargumentsの単純化 strictモードでは「eval」「arguments」という名前がキーワードとして扱われるため、これらのキーワードに対して言語構文でのバ
XMLHttpRequest の使い方 - WebOS Goodies
今日は、 JavaScript の XMLHttpRequest オブジェクトの使い方を調べてみたので、それをご紹介しようと思います。 XMLHttpRequest はサーバーに対して HTTP リクエストを発行するためのオブジェクトで、 Ajax の A (Asynchronous) を司る中核技術です。これにより、Web ページを切り替えることなくサーバーからデータを取得し、ページ内容を更新することができます。 さあ、一緒に Ajax の世界へと足を踏み入れましょう！（＾＾） 使用方法 それでは、XMLHttpRequest オブジェクトの使用方法を順を追ってご紹介します。 XMLHttpRequest オブジェクトの作成 XMLHttpRequest オブジェクトを作成する方法は、 Firefox, Opera と IE で異なります。 Firefox, Opera の場合は単に X
JavaScript で、 他の JavaScript ファイルを読み込むにはどうしたらよいでしょうか？…
JavaScript で、 他の JavaScript ファイルを読み込むにはどうしたらよいでしょうか？ ------ どうしたいかというと、 <script type="text/javascript" src="aaa.js"></script> という風に HTML から aaa.js を読み込んでいますが、bbb.js も読み込みたいと思っています。 <script type="text/javascript" src="aaa.js"></script> <script type="text/javascript" src="bbb.js"></script> とせず、 aaa.js に bbb.js を読み込みたいと思っています。
JavaScriptにおける命名規則の個人的まとめ｜もっこりJavaScript｜ANALOGIC（アナロジック）
JavaScriptにおける命名規則については、すでに様々なネット上の記事や書籍などで取り上げられているので、今さらこのブログで新しく紹介するようなものは特に何もないのですが、これらの情報ソースの内容には互いに微妙に異なる部分（内容が競合する部分）もあったりします。 私自身、JavaScriptの命名規則についてはざっくりとは知りつつも、（個人で開発することが多いくせに）プロジェクトが変わる度に微妙に異なる規則でコーディングしていたりと、結構曖昧な状態でここまでやってきてしまいました。 ですので、これらの情報ソースを元にして自分なりのルールを整理しておきたいなと思ったので、ここにまとめておくことにしました。 本エントリは、JavaScript全体に関わるコーディング規約ではなく、あくまでも「命名規則」に絞った内容になっています。自分用のまとめ色が強いエントリになっていますので、ここに書いた
ページをリロードする方法 - JavaScript
ページを<META>タグのrefreshでリロードさせることが出来ますが、これをJavaScriptにより行うことが出来ます。ブラウザの「更新」と同様の効果があります。 ユーザにリロード時間を指定させるような時等に使用すると良いでしょう。
一定時間経過後に指定したページへ移動する - JavaScript
サンプルと機能 → Sample 1：一定時間経過後にページを移動 → Sample 2：一定時間経過後にページを移動（<META>タグ使用） 一定時間経過後にページを移動させます。 サイトを引っ越した時や、NotFoundページに設置すると効果的です。 サンプルスクリプト 緑の文字が変更箇所で、赤い文字が対応するスクリプトです。 "//"以下はコメントです。削除しても影響ありません。 必要な箇所をコピー＆貼り付けして編集してください。 → Sample 1：一定時間経過後にページを移動 <HTML> <HEAD> <TITLE></TITLE> <SCRIPT language="JavaScript"> <!-- // 一定時間経過後に指定ページにジャンプする mnt = 5; // 何秒後に移動するか？ url = "http://www.eweb-de
JavaScriptのイベントハンドラ一覧｜イベント｜JavaScript/DOM｜PHP & JavaScript Room
イベントハンドラ一覧 onBlur／onFocus〔フォーカスが移動した時に処理を行う〕 onChange〔フォームの入力値、選択が変更されたときに処理を行う〕 onSelect／onSelectStart〔テキストが選択された時に処理を行う〕 onSubmit／onReset〔フォームの送信時、リセット時に処理を行う〕 onAbort／onError〔画像読み込み時に処理を行う〕 onLoad／onUnload〔ページ読み込み時、ページの切り替え時に処理を行う〕 onClick／onDblClick〔クリック、ダブルクリックされた時に処理を行う〕 onKeyPress／onKeyDown／onKeyUp〔キーの状態に応じて処理を行う〕 onMouseOut／onMouseOver／onMouseDown／onMouseUp〔マウスを乗せたり離した時、マウスでクリックした時に処理を行う〕
日付フォーマットなど 日付系処理 - Qiita
日付をフォーマットする 日付をフォーマットして返す。フォーマット（第二引数）を省略した場合2014-01-23 01:23:45.678みたいな形で返す。 /** * 日付をフォーマットする * @param {Date} date 日付 * @param {String} [format] フォーマット * @return {String} フォーマット済み日付 */ var formatDate = function (date, format) { if (!format) format = 'YYYY-MM-DD hh:mm:ss.SSS'; format = format.replace(/YYYY/g, date.getFullYear()); format = format.replace(/MM/g, ('0' + (date.getMonth() + 1)).slice(
今日の日付と現在時刻－JavaScript入門
HOME JavaScript入門 今日の日付と現在時刻 ここからJavaScriptで日付と時間を扱う方法について解説していきます。 まず最初は、今日の日付と現在時刻を取得する方法について説明します。 今日の日付を取得する まずはHTMLのBODY内に以下のコードを記入してみてください。 <script> //今日の日付データを変数hidukeに格納 var hiduke=new Date(); //年・月・日・曜日を取得する var year = hiduke.getFullYear(); var month = hiduke.getMonth()+1; var week = hiduke.getDay(); var day = hiduke.getDate(); var yobi= new Array("日","月","火","水","木","金","土"); document.wr
Javascriptでtableタグに行、列の追加や削除を行う | ScrapEngineer
Javascriptで行うテーブル操作を一通りまとめました。 行列の操作やセルの取得方法などなど、サンプルコードもあります。 テーブルの要素を取得 // IDからテーブルを取得 var table = document.getElementById("table_id"); こちらはテーブルの要素を取得できればいいので自分の好みidから取得してます。 行数取得 var table = document.getElementById("table_id"); var rows = table.rows.length; // 行数 行追加 var table = document.getElementById("table_id"); // -1で末尾に追加。インデックスで指定の位置に追加も可能 var rows = table.insertRow(-1); ※行の追加だけ行うとtrタグのみの
element.appendChild - 指定要素へ子要素追加 - JavaScriptリファレンス
「指定要素へ子要素追加」サンプルコード <html> <head> <title>element.appendChild - 指定要素へ子要素追加</title> </head> <body> <!--指定要素へ子要素追加のサンプル--> <script type="text/javascript"> function addElement() { var element = document.createElement('div'); element.id = "id"; element.innerHTML = "hogehoge"; element.style.backgroundColor = 'red'; var objBody = document.getElementsByTagName("body").item(0); objBody.appendChild(element)
document.createElement - 指定タグでのエレメント作成 - JavaScriptリファレンス
「指定タグでのエレメント作成」サンプルコード <html> <head> <title>document.createElement - 指定タグでのエレメント作成</title> </head> <body> <!--指定タグでのエレメント作成のサンプル--> <script type="text/javascript"> function addElement() { var element = document.createElement('div'); element.id = "id"; element.innerHTML = "hogehoge"; element.style.backgroundColor = 'red'; var objBody = document.getElementsByTagName("body").item(0); objBody.appendCh
【JavaScript】生年月日を入力したら自動的に現在の年齢を入れてくれる
プロフィールなどで自動で現時点の年齢を入れてくれるプログラム探してて良いサイトがあったので覚書です。 JavaScript だとハマる ～生年月日から年齢を計算する簡単な計算式～ JavaScriptなので、汎用性も高いのでいいよね！！ こちらをコピペして、表示させたいところに入れてね！！ <script type="text/javascript"> function calculateAge(birthday) { // birth[0]→year, birth[1]→month, birth[2]→day var birth = birthday.split('-'); var _birth = parseInt("" + birth[0] + birth[1] + birth[2]); var today = new Date(); var _today = parseInt(""
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
テキストフィールドへの入力を禁止する