jQuery API の data( key, value ) は、マッチしたDOM要素と任意のデータを関連付けるメソッド。 引数 key データのキー。 文字列。 value 新しいデータの値。 配列やオブジェクトなど、任意のJavaScriptの型で指定。 戻り値 jQuery jQueryオブジェクト。 記述方法
jQuery API の data( key, value ) は、マッチしたDOM要素と任意のデータを関連付けるメソッド。 引数 key データのキー。 文字列。 value 新しいデータの値。 配列やオブジェクトなど、任意のJavaScriptの型で指定。 戻り値 jQuery jQueryオブジェクト。 記述方法
マッチした要素に、任意のデータを関連付けます。 引数 [key]オプション String: データのキー [value]オプション Object: データ [Object]オプション (version 1.4 から) Object: データ(キーと値のハッシュ) 戻り値 jQuery: jQuery オブジェクト マッチした要素に関連付けたデータを取得します。 引数 [key]オプション String: データのキー 戻り値 Object: キーに対応する関連付けたオブジェクト。キーを省略した場合は、要素に関連付けられているオブジェクト。 例 「data」ボタンを押すと、p 要素に "p_data_key" というキーで "data associated !" というデータを関連付けます。 「removeData」ボタンを押すと、p 要素に関連付けたデータを削除します。 p 要素をクリック
jQueryには任意の範囲、要素を指定するためのセレクタと呼ばれる機能が用意されています。 たとえば、BODY要素内にあるすべての画像にアクセスしたい場合は下記のようにセレクタを指定します。 $("img") 例えば、IMG要素のボーダーを3ピクセルの赤に設定するには次のようにします。 $("img").css("border","3px solid red"); セレクタで対象を指定し、cssというメソッドでボーダー属性の値を設定しています。 セレクタは要素名以外にも、ID名やCLASS名を指定することができます。 たとえば、BODY要素内にあるすべての画像にアクセスしたい場合は下記のようにセレクタを指定します。 $("img.photo") IMG要素で、かつID名が photo01 の要素を指定するには、次のようにシャープの後にID名を指定します。 $("img#photo01")
JavaScriptに、applyとcallというメソッドが用意されていますが、自分なりにapplyとcallの丁寧に説明をしてみようと思ってこのエントリーを書くなどをしてみます。 applyとcallは非常に似たメソッドなので、まずはcallから説明します。 callメソッドとは? callメソッドは以下のように呼び出します。 methodA.call(thisArg, [, arg1 [, arg2, ...]]); methodAには任意の関数(メソッド)を指定します。 callの引数は第一引数にmethodAのthisとしたいオブジェクトを指定して、第二引数以降はmethodAに渡したい引数があれば、カンマ区切りでそれぞれ指定します。 callメソッドは、すべての関数が共通して持っているメソッドです。すべての関数はFunctionクラスのオブジェクトで、callはFunction.
JavaScript の function オブジェクトには call メソッドと apply メソッドというものが標準で用意されています。不思議な動作をするメソッドであり、その有用性を理解するのは難しいのですが、いつか役に立つ時がくるはず?なので調べました。 call メソッドの基本的な動作 まず、オブジェクトと関数を定義します。
for〜in文 for文では、繰り返し処理の回数をカウンターで行ないました。for〜in文ではArrayの要素の数だけ処理を行います。for〜in文をつかって配列を操作してみます。 <?xml version="1.0" encoding="utf-8" ?> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>配列の参照</title> </head> <body> <h2>for〜in文</h2> <script type="text/javascript"> var array01 = [1,2,3]; //array01オブジェクトをつくります for(index in array
例えばJAVAには、for-each文という便利な構文があります。 class Test { public static void main(String args[]) { int [] ary = new int[] { 1, 2, 3, 4, 5 }; for(int num : ary) { System.out.println(num + ","); } } } 実行結果 1,2,3,4,5, これは拡張for文とも言われ、配列のすべての要素にアクセスすることができます。 Javascriptにも似たような構文のfor-in文があります。 が、このfor-in文実に曲者で、JAVAのfor-each文と同じ感覚で使うと、必ずどこかで痛い目を見ます。 例文を見てみましょう。 <html> <head> <title>for inテスト</title> </head> <body>
JavaScript で繰り返し処理を行う方法のひとつである for...in 文の使い方について解説します。 for...in 文ではオブジェクトに含まれるプロパティ名を順に取得します。
v1.13.7 CDN URLs (Use with <script src="..."></script>) https://cdn.jsdelivr.net/npm/[email protected]/underscore-umd-min.js https://cdn.jsdelivr.net/npm/[email protected]/underscore-esm-min.js https://unpkg.com/[email protected]/underscore-umd-min.js https://unpkg.com/[email protected]/underscore-esm-min.js https://pagecdn.io/lib/underscore/1.13.7/underscore-umd-min.js https://pagecdn.io/lib/unde
この記事が対応するCoffeeScriptのバージョンは1.7です。 基本的には本家サイトCoffeeScriptの内容と同じです。わかりやすいように色々と私が勝手に再構築、追加してはありますが。(日本語訳と紹介されるとちょっと心外ですな(´Д⊂ヽ ) なお、JavaScriptの基礎知識を前提とし、JavaScriptから引き継ぎ重複する内容は解説されません。 あ。後、この記事の文章、CoffeeScriptコード、JavaScriptコードに関する著作権は放棄しています。パブリックドメインと言うそうです。文章、コード自由に引用改変公開しても問題ありません。 最終更新日:2014/1/29 追加: 文字列 演算子など はじめに:CoffeeScriptのメリットとデメリット 一般に言われているCoffeeScriptを使うメリットデメリットを載せておきます。 ま、こんな論争気にせず、使っ
JavaScriptのthisは同じソースコードでも呼び出し元次第で意味が違ったりして複雑だと思われがちだけど、一回覚えてしまえば簡単だ。 JavaScriptにはthisが4種類ある これだけをしっかり覚えておけば、後は必要な時に 4種類って何があるんだっけ? と考えれば容易に思い出せる。 ちなみに、下記のコードはブラウザ上で実行することを想定している。(なのでwindowを使う) トップレベルのthis グローバルオブジェクトを指す。 var hoge = "fuga"; window.foo = "bar"; // fuga+bar と表示される console.log(this.hoge + "+" + this.foo); (function(){ // 同じくfuga+bar と表示される console.log(this.hoge + "+" + this.foo); })(
前回までのおさらいと今回のあらすじ 前回までの記事で、JavaScriptでオブジェクト指向を行うにあたって必要な知識を一通り網羅しました。その中で、オブジェクトに属する関数=メソッドについても触れました。 今回は、オブジェクトやメソッドと深い関わりのあるキーワード、「this」について解説したいと思います。 thisキーワードについてきっちり理解する 「thisキーワードについてお話しする」と言いましたが、実はthisキーワードは連載中で既に触れています。連載第9回で、このように述べています。 「(thisキーワードは)実行中のコードが「自分自身」を表すオブジェクトにアクセスするためのキーワードです。」 「実行中のコード」とされているのは、関数(メソッド)などの実行可能なコードということです。つまり、thisキーワードはメソッドをメンバに含むオブジェクトを指す、と言って良いでしょう。 例
こんにちは、太田です。前々回、前回とJavaScriptにおける継承について学習しました。今回はそれに深く関わるthisについて学んでいきます。 JavaScriptのthisはややクセのある動作をするように思えるかもしれませんが、仕組みをしっかり把握すれば実に簡単です。特に重要なのは次の2点です。 thisが何を指すかは関数の呼び出し方で決定する thisは関数スコープに存在する特殊な変数である インスタンスとしてのthis では、まずはコンストラクタ内でのインスタンスとしてのthisを見てみましょう。 コンストラクタとthis function A(name){ this.name = name; } A.prototype.getThis=function(){ return this; }; var a = new A('aaa'); console.log(a); console
などと省略して書けます。 echo と print は(ほぼ)同じものですが、 echo の方が文字数が少ないので(笑)オススメです。 flush関数を使うと、出力を即座にブラウザに表示させることができます。 長く実行時間のかかる処理で、途中経過を逐次表示させたい場合は、 flushを毎回呼び出すと良いです。 (実際には、flushとob_flushを両方呼ぶ必要があります) (例) flushを使ったサンプル
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く