Category Archives: JavaScript カテゴリ "JavaScript"のRSS  

Amazonマーケットプレースの出品情報を抽出する(GreaseMonkey使用)

2012年9月24日 (カテゴリ: JavaScript:, , )

Amazonには、マーケットプレース(通称マケプレ)という中古の商品を購入出来るシステムがあります。マーケットプレースを使用すると欲しい商品を安価で手に入れることが出来るので、非常にお得です。 ですが、マーケットプレースの出品者一覧ページが非常に見づらく不便です。 出品者情報は、価格が安い順に1ページ当たり15件の情報が表示されるのですが、例えばある商品の出品一覧ページを見てみると、こんなに長くなっています。 個人的には、古本なんてそこそこの品質のものが安く手に入ればよいだけなので、この情報量は親切を通り越して却って分かり辛くなっています。 というわけで、今回はマケプレの出品者一覧を加工して見…


続きを読む

javascriptで の空白がマッチしない

2012年9月23日 (カテゴリ: JavaScript:)

htmlで、文字中で改行させて欲しくないスペースとして というものがあります。 このnbspは文字コードだと160になります。 という事は16進だと0xA0,二進数だと”1010 0000″です。 一方普通のスペースは,0x20です。 両者の二進数表記を比べると最上位ビットが違うだけという事が分かります。 二進表記 内容 ———- ————- 10100000 nbsp 00100000 普通のスペース また、htmlでは文字コード指定での指定も出来るので、 は&160;とも表記可能です。 ちなみに、nbspによる空白はブ…


続きを読む

[JavaScript]VBのInStr()相当の処理を,JavaScriptで使用するには?

2012年9月23日 (カテゴリ: JavaScript:)

VBでは、文字列中に指定した文字があるかを調べる関数として、InStr()というものが有ります。 JavaScriptで同等の処理を行いたい場合は、indexOf()メソッドを使用します。 object.indexOf( string keyStr ); 例えば、以下のコードではiに2が入ります。 var data = ‘testdata’; var i = data.indexOf( ‘st’ ); console.log( i ); indexOfの戻り値は最初の文字にマッチする場合0が返るので、2が入るという事は3文字目からという意味です。また、マッチする…


続きを読む

[jQuery]タグのnodeTypeで比較可能な値とその意味の一覧

2012年9月23日 (カテゴリ: JavaScript:)

jQueryを使うと以下の様な感じで、タグのnodetypeを取得/比較することがあります。 textNodes = $(‘div.main’).contents() .filter(function(){return this.nodeType === 3}); NodeTypeとして指定できる値とその意味の一覧です。 NodeType一覧 ELEMENT_NODE == 1 HTMLタグ   ATTRIBUTE_NODE == 2 HTMLタグの属性   TEXT_NODE == 3 タグ内の普通のテキスト CDATA_SECTION_NODE == 4 CDATA &…


続きを読む

[javascript]スクロールバーなどを含めたウィンドウのサイズを知る方法

2012年9月10日 (カテゴリ: JavaScript:)

備忘録としてのメモ。 window.open()で指定する幅と高さの解釈はブラウザによって異なり、ウィンドウ内部領域と見なすものもあれば、スクロールバーなどの枠を含めたウィンドウ全体の大きさと見なすモノも有る。 枠の中の実サイズを知りたい場合、innerWidth/Heightが使える場合はそれを使用すると簡単 resizeToはウィンドウ内部のサイズを指定するが、offsetWidth/Heightはスクロールバーなどの枠を含めたウィンドウ全体の大きさを返すので、その差でinnerWitdh/Heightを求める。 window.resizeTo()はChromeだと使用できない。 oute…


続きを読む

jQuery sparklineの簡単なサンプル4つ

2012年4月13日 (カテゴリ: JavaScript:)

jQueryのプラグインである”jQuery sparkline”を使用すると、webページ内に小さなグラフを埋め込む事ができます。 基本形 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> <script type="text/javascript" src="http://omnipotent.ne…


続きを読む

[VS2010]プロジェクトのフォルダに、*.sln.docstates.suoファイルが作成される。

2012年4月6日 (カテゴリ: JavaScript:)

プロジェクトが入っているフォルダをふと見たら、docstates.suoという拡張子のファイルが存在していました。 気になったので調べてみたところ、VisualStudioのプラグインの「Productivity Power Tools」をインストールしていると作成される設定ファイルでした。エディタで開いてみた感じでは、どのタブ(ファイル)をピン止めしているかなどの情報を管理しているっぽいです… このファイルは*.suoファイルと同じくユーザ毎の環境を管理しているファイルなので、gitやSubversionなどのバージョン管理ソフトを使用している場合は、管理下に含める必要ありません…


続きを読む

[JavaScript]即時関数の呼び出しが,なぜ「(function(){…})()」の形式になるか説明してみる。

2012年2月21日 (カテゴリ: JavaScript:)

JavaScriptでは即時関数という仕組みがあります。 即時関数は、グローバルな名前空間を汚さない無名関数を作って、その関数を直ぐにコールする方法です。 コードは、以下のような形式になります。 (function() { alert( "hello" ); })(); jQueryとかのサンプルを見ると良く見る形式ですが、なぜこの形式で即時関数を定義できるのか、 改めて考えてみます。 まず、無名関数を作ります。 function() { alert( &q…


続きを読む

[JavaScript]関数に、一度しか実行しない初期化処理を組み込む

2012年2月21日 (カテゴリ: JavaScript:)

関数に、コンストラクタのような一度しか実行されない初期化処理を組み込むことが出来ます。 下記の例では、getCounter()で関数オブジェクトを取得するたびに、初期化処理がコールされます。   // 関数の定義 var getCounter = function() { // コンストラクタ的な、初期化処理 console.log( "initialize" );   // この変数は呼び元から見えない(privateな状態になる) var counter = 0;   return function…


続きを読む

[JavaScript]例外発生時に、catch句でエラーの発生場所を取得する

2012年2月21日 (カテゴリ: JavaScript:)

JavaScriptのtry-catchのcatch句で取得できる例外オブジェクトは、エラーの内容を伝えるためにnameとmessageプロパティを持っています。 JavaScriptの標準規格では、例外オブジェクトが持っているプロパティは2つのみですが、firefox等の一部のブラウザでは、これらに加えてエラーが発生したファイルや行番号の情報も取得することが可能です。 これらの情報はfirefoxの場合はfileName,lineNumberで取得できますが、標準仕様からの拡張である為、IEでは取得することが出来ません。 ブラウザの互換性まで考慮したうえで、以下のようなエラー処理を書いておく…


続きを読む

[JavaScript]文字列リテラルと、new String()の違い。

2012年2月13日 (カテゴリ: JavaScript:)

JavaScriptの書籍を読むと、文字列の定義において以下の2つが同じであるという説明をしている場合があります(入門書だと良く有る説明です)。 case1: var msg = new String( "hello" ); case2: var msg = "hello"; 確かに両者ともalert( msg );で、メッセージを出力できるので一見すると同じに見えるのですが、実は一緒では有りません。 両者の違いは、下記のコードを実行してみると分かります。 var msg = new String( "hello&quo…


続きを読む

zenbackのスクリプトを解析してみた(3/3)

2012年2月11日 (カテゴリ: JavaScript:, , )

zenback解析シリーズ連載: zenbackのスクリプトを解析してみた(1/3) zenbackのスクリプトを解析してみた(2/3) zenbackのスクリプトを解析してみた(3/3) 前回の続きです。 cssとhtmlには特に見るべき所が無さそうなので、javascriptだけチェックしていきます。 zb_jq("div.zenback-twitterbtn > a:first").click(function() { this.disabled = true; var title = (document…


続きを読む

zenbackのスクリプトを解析してみた(2/3)

2012年2月11日 (カテゴリ: JavaScript:, , )

zenback解析シリーズ連載: zenbackのスクリプトを解析してみた(1/3) zenbackのスクリプトを解析してみた(2/3) zenbackのスクリプトを解析してみた(3/3) 前回、以下のURLでzenbackのブログパーツ本体を取得しているところまで解析しました。 http://widget.zenback.jp/?callback=jsonp1328934279143&base_uri=http%3A%2F%2Fnanoappli.com%2Fblog& rand=276590972233&nsid=101368938457261269%3A%3A10…


続きを読む

zenbackのスクリプトを解析してみた(1/3)

2012年2月10日 (カテゴリ: JavaScript:, , )

zenback解析シリーズ連載: zenbackのスクリプトを解析してみた(1/3) zenbackのスクリプトを解析してみた(2/3) zenbackのスクリプトを解析してみた(3/3) ブログパーツを作成してみたいのですが、手始めに勉強としてzenbackの動作原理を解析してみました。 まず、入り口です。 サイトにて提示されているスクリプトは以下の通りです。xxxの部分にはサイトに応じた値が入ります。 (実際は1行ですが見辛いので適当に改行してます。) <!– X:S ZenBackWidget –> <script type="text/javascrip…


続きを読む

JavaScriptをブラウザだけで作成&テスト出来る環境を作った(JS.nanobench)

2012年2月10日 (カテゴリ: JavaScript:)

JavaScriptの動作確認をしているのですが、「エディタで編集 ⇔ ブラウザで確認」の行ったりきたりが面倒なので、ブラウザだけで確認できるようにしました。 作ったもの これです↓ JS.nanoBench プログラム: console.log( 2 * 3.14 ); 出力結果: エラー: 仕組み 仕組みは、textAreaの中身をevalして出力してるだけです。 …だと説明にならないので、html,js,cssのソース見ながら解説して行きます。 html まずは、htmlの構造です。 特に何の変哲も無いhtmlです。 各パーツにidを振ってあるのと、ボタンのonclickだけ…


続きを読む

http://www.google.com/jsapiを使用してjQueryをロードするときの注意点

2012年2月10日 (カテゴリ: JavaScript:)

http://www.google.com/jsapiを使用した、jQueryのロード 以下の記述で、googleがホスティングしているjQueryを利用することが出来る。 <script src="http://www.google.com/jsapi" type="text/javascript"></script> <script type="text/javascript"> google.load("jquery", "1.4"); …


続きを読む

[jQuery]一度発行したajaxリクエストを途中で中断する方法

2012年2月7日 (カテゴリ: JavaScript:)

jQueryでサーバからデータを取得する際、ajaxで問合せを行うと非同期処理となる為、ユーザビリティが向上します。 ですが、データの問い合わせによっては、サーバ側で非常に時間が掛かる場合もあります。 この際に一旦行った問い合わせをキャンセルする場合は、どうしたらよいでしょうか? 一旦行ったリクエストをキャンセルする場合は、$.ajax()で取得したオブジェクトに対して、abort()をコールするとリクエストのキャンセルが可能です。 サンプル: var req;   // 検索を行う $( "btnSearch" ).click( func…


続きを読む

[jQuery]formのselect要素を操作する方法まとめ

2012年2月6日 (カテゴリ: JavaScript:)

jQueryを使用して、formのselect要素を操作する方法のまとめです。 例は、以下のselect要素があった場合で記述しています。 <select id="selTest" size="6" multiple> <option value="key1">value1</option> <option value="key2">value2</option> <option value="key3">value3&lt…


続きを読む

[jQuery]セレクタで指定したノードの存在チェックを行う関数

2012年2月5日 (カテゴリ: JavaScript:)

jQueryでは指定したノードが存在するかを存在するチェック関数が有りません。 幸い、jQueryではjQuery.fnにメソッドを追加することで、期待するような処理を行うことが出来ます。 jQuery.fn.exists = function(){return this.length>0;} 呼び出し側は、以下のような感じになります。 if ($(selector).exists()) { // ノードが存在したときの処理を行う } …もちろん、こんな関数を使用しなくても…


続きを読む

[JavaScript]ハッシュに登録したデータの削除方法

2012年2月5日 (カテゴリ: JavaScript:)

例えば、以下のハッシュがあった場合に var dataList = {"key1":"value1", "key2":"values" }; key1は、こうやって削除できます。 delete dataList.key1; 削除キーが動的に決まる場合は、”[]”で指定することも可能です。 var keyName = "key1"; delete myJSONObject[ keyName ];


続きを読む