When writing code for the Web, there are a large number of Web APIs available. Below is a list of all the APIs and interfaces (object types) that you may be able to use while developing your Web app or site. Web APIs are typically used with JavaScript, although this doesn't always have to be the case. A Audio Output Devices API Experimental B Background Fetch API Experimental Background SyncBackgr
追記: Rangeを使うと, 86行に及ぶDOM操作がなんと2行に! 勝手に添削: Selection内のHTML Textをいい感じに取得する: Days on the Moon Tomblooの最新版ではEvernoteの取り込み機能がつき, これに伴いHTML Textを取得する周りで大規模な変更がありました. これのなかで nsIDocumentEncoder などのXPCOMが使われているのですが, Taberareloo移植の際, もちろんXPCOMなんてものはChromeにはありません. それで, 書いてみました. function convertToHTMLString(src, safe){ var doc = src.ownerDocument || src.focusNode.ownerDocument; if(src.focusNode){ // selection
DOM仕様書にこれらのプロパティについて図解入りで説明がありわかりやすい。 文字を選択した時に表1のプロパティがどのように変化するかを表示するサンプル。 http://www.bit-hive.com/~tomita/RangeDump/ JavaScriptのソースはhttp://www.bit-hive.com/~tomita/RangeDump/range.js 3. 現在の選択範囲の取得の仕方(IEの場合) IEのRangeオブジェクトにはテキストの選択範囲を表すTextRangeと画像などのコントロールオブジェクトの選択を表すControlRangeの2種類が存在する。 3.1 TextRange,ControlRangeの取得 IEの場合Selectionはdocument内に既にあるので以下のようにして取得できる。 var range = document.selection
John Resig - Pure JavaScript HTML Parser JavaScript単体で動作するHTMLパーサー。 JavaScript単体で、HTMLをパースしてXMLに変換するデモも公開されています。 次のように、閉じていなかったり、不正なHTMLを正すことが可能です。 JavaScriptでの実装のため、クライアントサイドでこの処理が可能になります。 例1) <b>Hello <p>John ↓ <b>Hello </b><p>John</p> 例2) <a href=">aaa ↓ <a href=""">aaa</a> HTMLtoDOM関数で、HTMLをDOMに変換することも可能みたい。 JavaScriptでスクレイピングしたりできそうですね。 関連エントリ PHPでのスクレイピングに役立つライブラリ色々 XPath使いのための日本語チートシート
11/16/2007 DOM のロード直後に実行する関数の指定方法 Javascript で DOM を操作する際にはページ内の DOM 要素がロードされている必要がある。 このとき問題になるのは、DOM がロードされたタイミングをどのように検知するか。DOM がロードされたタイミングで実行する関数の指定方法。ということになる。 まず、次のような html を考える。 <html> <head> <title></title> <script> // ページヘッダの読み込み時刻を記録 var start = new Date(); </script> </head> <body> <!--ロードに10秒かかる画像を指定--> <img src="http://example.com/sleep10" /> </body> </html> ここで、 image 要素には 10 秒後に結果を返
JavaScript-XPath とは JavaScript-XPath は、 DOM 3 XPath を実装していないブラウザに対して、実用的な速度で動作する DOM 3 XPath のエンジンを追加します。 一言で乱暴に言ってしまえば、どのブラウザでも document.evaluate って関数で XPath 使えるようになるよ!ってことです。 以下が公式サイトになります。 http://coderepos.org/share/wiki/JavaScript-XPath DOM 3 XPath ってなんなの!? めっちゃ簡単(で、ちょっとだけ適当)なDOM 3 XPath の説明をします><。 JavaScript でよく使う document.getElementById や document.getElementsByTagName って関数ありますよね? DOM 3 XPath
多彩な演出効果をカンタンに導入できる事で脚光を浴びたprototype.jsの登場を皮切りに、インターネットで公開されているJavaScriptライブラリの数は、この一年で急激に増加した。何かやりたいことがあったときはWebで検索すれば、大抵、どこかにライブラリが転がっている。便利な世の中になったものだ。 一方、Webを通じて提供されるサービスは多様化の一途を辿っている。JavaScriptライブラリは整ってきたが、当然、置くだけでは機能しない。ライブラリのサポートページには簡単なサンプルが載っているものの、サンプルがそのまま適用できるケースはごくわずかだ。しかたなく、他の誰かが似たような事をやっていないかとWeb検索するはめになる。 思えば、これまでJavaScriptを言語としてとらえ、きっちり向き合う機会は少なかったのではないだろうか。 1995年の終わり、Netscape Navi
Web上のコードを参考にするとtypoのせいで、あるはずの属性が無かったりする。 そんな時の確認用。 var dumpObj = function(o){ var str = ""; for(var i in o) { str = str + "\n" + i + "\t"+ o[i]; } alert(str); } 再帰的に全部表示したいとか、文字コード順にソート表示したい時はこちらのコードが参考になる ⇒ JSON的なダンプをとる関数を作ってみた@ 考え得る最高を常に行う
HTMLと解釈される文字文字列を画面に表示するときはその文字をエスケープしないといけない。 ・・・そのやり方 prototype.jsに面白いやりかたがのってたのでそれを単体で切り出すと↓こういう感じになる //htmlな文字をエスケープ var escapeHTML = function(_strTarget){ var div = document.createElement('div'); var text = document.createTextNode(''); div.appendChild(text); text.data = _strTarget; return div.innerHTML; } 何かHTML要素の中のテキストノードにエスケープされていない文字列を突っ込んで、それを要素のinnerHTMLとして取り出すと、エスケープされた文字列を得ることができる。 タ
友達と鍋を食べに行く。しかも食べ放題。 お腹が強烈にすいていたので美味しく頂きました。しかも飲み放題なので、ビール・日本酒・ウイスキー立て続けに飲んで大いに満足。 店員さんの対応がおそらくチェーン店ながら、きちんとしていて好印象。 帰りがけにゲームセンターによってUFOキャッチャーで格闘。取れそうで取れない…。 で、結局今日は取れなかった。まぁ、こういう日もある。 ajaxで画面の一部を更新する際、通常だとブラウザの「戻る」でユーザが所望する画面遷移が実現できないことがあるのだけれど、このライブラリを利用すると問題を解決することができる。 Really Simple History (RSH): Ajax history and bookmarking library http://code.google.com/p/reallysimplehistory/ 使い方は、ソースをダウンロード
AJAXベースのアプリケーションに取り組んでいれば、その動的な性格から、アプリケーションのどこかでページをブックマークすることができないことに気づいただろう。これは、ユーザーが「戻る」ボタンを押した時にも問題になる。ブックマークと履歴の問題を解決する方法の1つが、Really Simple History(RSH)フレームワークを使うことだ。 RSHの必要性は、動的なウェブサイトとブラウザ組み込みの操作方法の組み合わせに固有の問題から生じている。ブラウザは複数のページから成るサイトを念頭に開発されており、AJAXを用いた動的アプリケーションは前提としていない。 問題は、ユーザーがAJAXを用いたサイトの外側でナビゲーションの操作をした場合に生じる。ユーザーがサイトに戻ってきた時には、ユーザーはその結果は起こることに驚くことになる。前にサイトを訪れた時の状態が維持されないからだ。 この問題を
いまやWeb制作に欠かせなくなったJavaScript。でも、「JavaScriptはほとんど“アリモノ”で済ませている」という方も多いのでは? そこで、WebデザイナーやマークアップエンジニアなどのWeb制作者の方向けに、いま一番人気のJavaScriptライブラリー「jQuery」の基本を学べる特別レッスンをお届けします。題して、「40分で覚えるjQuery」。要点だけにぎゅっと絞って解説しますので、手を動かしながら今すぐjQueryを始めましょう。 【0分目:導入編】 jQueryのダウンロードと利用方法 jQueryのライブラリー本体(JavaScriptファイル)は公式サイトからダウンロードし、head要素などにscript要素を書いて読み込みます。
PHPのdate関数のフォーマットパターンと互換性のあるJavaScriptの日付フォーマットライブラリです。 ただし、全てのパターンが実装されているわけではありませんので、注意してください。PHPにない拡張機能として、日本語の曜日と旧暦の月名を表示することができます。 DateFormatter.jsをロードします。 <script type="text/javascript" src="./DateFormatter.js"></script> DateFormatterオブジェクトのformatメソッドでフォーマットを行います。例えば、現在の年月日時間を表示するときは以下のようにします。 var now = new Date(); alert(DateFormatter.format(now, "Y/m/d H:i:s")); 表示結果は「2007/01/15 16:30:12」とい
プログラミングのこつ 無駄な名前を極力使わないこと。意味単位に名前空間を細かく階層的に分離すること。 ここで言う名前空間とは 名前空間とは、一つの名前が一意のものを表す空間。例えば、大きな目で見れば、日本語は自然言語の名前空間である。また、専門用語なども名前空間と考えることが出来る。 日本語 { コンニチワ = 挨拶 : : } 中国語 { ニーハオ = 挨拶 } 英語 { ハロー = 挨拶 } また、名前空間は重なり(優先順位)を持つ 同音異義語などの言葉は、それぞれの細かい名前空間の重なりによって一意のものに特定されると考えられる たとえば、「コイが好き」と言った場合 池に関する名前空間 { コイ = すいすいパクパク } チャライ話題に関する名前空間 { コイ = ドキドキきゅんきゅん } お茶に関する名前空間 { コイ = にがーい } 名前空間の優先順位を考えると、一意の意味を知
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く