JavaScriptのDOM Core基礎 - 三等兵
Coreの簡易リファレンス。Coreは要素を参照したり、相対位置から周りのノードを参照したり、要素を生成するといった部分。主に利用するであろうプロパティやメソッドはカバーしているつもりですけど、これも入れとけってのあったら教えてください。 このあたりは地味で使いづらくその上理解しにくいという残念な部分。ふと忘れたときに使う個人的なものですが、慢性jQuery拒絶症候群な人よかったらどうぞ。それにしても暑い。ガリガリ君おいしいね。 DOMとは。 Document Object Model (DOM) は、HTML および XML ドキュメントのための API です。これはドキュメントの構造的な表現を提供し、内容や表示形態の変更を可能にします。端的に言えば、Web ページをスクリプトやプログラミング言語とつなぐような機構です。 https://developer.mozilla.org/ja/
$(DHTMLcoders).read(this) || throw your.job - 書評 - jQueryクックブック : 404 Blog Not Found
2010年08月19日01:00 カテゴリ書評/画評/品評Lightweight Languages $(DHTMLcoders).read(this) || throw your.job - 書評 - jQueryクックブック オライリー矢野様より献本御礼。 jQueryクックブック jQuery Community Experts / 株式会社クイープ訳 [原著:jQuery Cookbook] これでなくなった。 jQueryを使わない理由が。 DHTMLを利用する全ての人、必携。 特にHTMLやCSSを書いても、JavaScriptはそれほど書かない人。これであなたにも書けるようになります。 本書「jQueryクックブック」は、今や最重要のJavaScript Libraryといっても過言ではないjQueryの手引書。 目次 まえがき - John Resig はじめに jQuer
要素が document につながっているかを高速に調べる方法 - IT戦記
とある要素が document につながっているかどうかを調べたい！ とりあえず、ほとんどすべてのブラウザで出来る方法としては、 parentNode で確認することができますね。 function isElementInDocument(node) { do { if (node === document) { return true; } } while (node = node.parentNode) return false; } でも 前の例だとちょっと遅いので contains や、 compareDocumentPosition を使うといいです！ コードにすると以下のような感じ function isElementInDocument(node) { if (document === node) { return true } else if (document.compa
要素が画面上に見えているかどうかを調べる - by edvakf in hatena
document.elementFromPoint という便利な関数を知ったので、今作っている Chrome 用 Migemo ページ内検索で使ってみた。 これが困ったことに、ブラウザごとにかなり挙動が違うのだけど、本来の動作はこんな感じらしい。 待望の document.elementFromPoint が Firefox 3.0a8pre にて実装された。仕様は nsIDOMNSDocument.idl に詳しく書いてあるが、おおよそ以下の通りである。 HTML, XUL どちらの document に対しても使用可能 document の左上を (0, 0) とし、位置 (x, y) にある実際に見えている要素を取得する 同一の document 内に存在する要素のみ取得可能。例えばインナーフレーム内の document 内に存在する要素は取得できず、代わりに iframe 要素を返
DOMから始めるJavaScriptモダン・スクリプティング---目次：ITpro
近年，Ajaxの台頭をきっかけに，JavaScriptを使ったブラウザのリッチ・クライアント化が進んできました。現在では，ページの表示を変化させるだけであれば，ほとんどのことはJavaScriptのみで対処することが可能です。それを実現するのがDOMなのです。 第1回 DOMから始めるモダン・スクリプティングの世界へようこそ 第2回 ブラウザからHTMLはどう見えているかを理解しよう ～ドキュメントツリー～ 第3回 DOMスクリプティングのことはじめ(1) ～要素（タグ）を狙い撃ち～ 第4回 DOMスクリプティングのことはじめ(2) ～これはどんな要素？～ 第5回 DOMを使ってHTMLを自由自在に書き換える 第6回 イベントハンドラから脱却しよう 第7回 スクリプトを完全に分離しよう ～コンテンツ，プレゼンテーション，ビヘイビア～ 第8回 スクリプトのパッケージ化 ～使い回しできるスクリ
DOM オブジェクトとメモリリーク: Days on the Moon
IE でのメモリリーク ちょこちょこと紹介されているので知っている人も多いと思うが、IE には DOM ノードに絡んだメモリリークの問題がある。これに関しては Microsoft 自身の記事である「Understanding and Solving Internet Explorer Leak Patterns」に詳しいが、簡単にいえば DOM ノードオブジェクトに関する循環参照を作ると、IE を終了させるまでそのオブジェクトが解放されないというものだ。記事によればメモリリークには以下のようなパターンがあるという。 1. 単純な循環参照 ある DOM ノードオブジェクトのプロパティをたどっていくと自分自身に行き着く場合。以下のようなパターンが考えられる。 element.property == element element1.property1 == element2, element2
DOM (Document Object Model) について | MDN
Document Object Model は HTML と XML (en-US) ドキュメントへの API です。これは、ドキュメントの構造的な表現、その内容を変更可能にすること、そして視覚的なプレゼンテーションを提供します。本質的には、ウェブページをスクリプト又はプログラミング言語と結合します。 ウェブ開発者がウェブページを操作及び作成するのに役立つ全てのプロパティ、メソッド、そしてイベントは、objects に組込まれています。(例えば、document オブジェクトはドキュメントそのもの、table オブジェクトは HTML テーブル要素を表すなど)。これらのオブジェクトは最新のウェブブラウザのスクリプティング言語を通してアクセス可能です。 DOM は JavaScript との関連において最も頻繁に使われます。JavaScript で書かれたコードは、しかしウェブページとその要
XML ―DOMとは―
■ ＡＰＩ（Application Programing Interface） ＤＯＭの説明の前にＡＰＩについて説明します。 ＡＰＩ（Application Programing Interface）とは、プログラミング言語などでアプ リケーションを開発したりする際に、使用可能な命令や関数などの集合のことです。 全ての機能をプログラミングするのは無駄が多いため、多くのアプリケーションが共通し て利用できる機能などはまとめて提供されます。これにより、開発者はその機能を呼び出 すだけで簡単にその機能を使用したアプリケーションの開発を行う事が出来るのです。 これから説明するＤＯＭと、ＳＡＸは、 ＸＭＬパーサがもつＡＰＩなのです。 ■ ＤＯＭ（Document Object Model） ＤＯＭ（Document Object Model）とはＷ３Ｃ で勧告されている仕様の一つであり、 様々なソフ
DOM1仕様書
文書オブジェクトモデル(DOM)第1水準 仕様書 Version 1.0 この文書は、W3Cにより作成されW3C勧告として公開されている "Document Object Model (DOM) Level 1 Specification Version 1.0" (http://www.w3.org/TR/1998/REC-DOM-Level-1-19981001/) を、どら猫本舗が翻訳したものです。 最新版の仕様書は http://www.w3.org/TR/REC-DOM-Level-1/ にあります。 正式な仕様書はW3Cサイトにある英語版です。この日本語版は参考にすぎません。 この文書には翻訳上の誤りがあるかもしれません。どら猫本舗は翻訳の正確性を保証しません。あくまでご自身の責任でご利用ください。 お気付きの点がありましたらどら猫本舗までお知らせください。 REC-DOM-L
DOMとは コンピュータの人気・最新記事を集めました - はてな
Document Object Modelの略称で、W3Cによって策定・勧告される、HTMLとXMLのための標準化されたAPI。文書の論理構造と、プログラムから文書にアクセスし操作するため手段を定義する。様々なモジュールによって構成されており、2006年現在Level 1からLevel 3までの仕様が勧告されている。 プラットフォームやプログラム言語に依存しないインタフェースとして設計されているが、WebブラウザごとのダイナミックHTMLの非互換性を緩和するために生まれた経緯からJavaScriptで、またJavaでよく利用される。 簡単な書き方 function 関数() { document.getElementById("DIVタグ名").innerHTML="書き換え後の内容"; } <div id="DIVタグ名">書き換え前の内容</div>書き換え後の内容はHTMLを認識する
Document Object Model - Wikipedia
Document Object Model（DOM、日: ドキュメントオブジェクトモデル[1]）は、マークアップがなされたリソース（Document）をリソース要素（Object）の木構造（Model）で表現し操作可能にする仕組み、またそのモデルである。 DOMは、HTML文書やXML文書（あるいはより単純なマークアップされた文章など）をオブジェクトの木構造モデルで表現することで、ドキュメントをプログラムから操作・利用することを可能にする仕組みである[2]。Documentの種類、操作に用いるプログラミング言語の種類に依存しない仕様である[3]。 WHATWGがLiving Standardとして定義している。WHATWG以前はW3Cが仕様を策定しており、Level 1からLevel 4まで勧告している。 XMLを読み込むAPIであるSAXと異なり、XMLデータをツリー構造として扱う事がで
Latest > Flakes of Ideas > JavaScriptでDOMを使う――オブジェクト指向入門の入門 - outsider reflex
2003/9/3 2003/9/4 2003/9/5 2003/9/6 はじめに オブジェクトとプロパティ 連想配列 オブジェクトと連想配列 「クラス」というテンプレート オブジェクトとメソッド 特定の型専用の関数 「メソッド」というプロパティ クラスとメソッド 「オブジェクト指向」の簡単なまとめ DOMとオブジェクト指向 「DOM」とは何か？ インターフェースとクラス DOM操作の実例 簡単な処理の例 もっと複雑な処理の例 おわりに Cが分かる人には疑りぶかいあなたのためのオブジェクト指向再入門というページがお勧めです。僕の稚拙な説明よりずっと分かりやすいです。 Home Back to Flakes Prev. Next はじめに JavaScriptでDOMを使う。DOMはHTMLやXMLをスクリプトやプログラムで操作するのにとても便利な技術ですが、簡単なスクリプトくらい書けるからD
DOM = フレームバッファ - id:anatooのブログ
この記事はDOM = Frame buffer | Quixey Blogを勝手訳したものです。 もしあなたが大規模なAJAXアプリケーションを書いているなら、このようなコードを書くのを許せるだろうか。 if (jQuery("#file_menu").is(":visible")) { ... } 駄目だ、これは全然良くない。というのも、プログラムの状態の保持をDOMに依存しているからだ。私たちは以下のように主張したい。DOMは木構造を持っているにもかかわらず、あなたのアプリケーションの出力をエンコードするのみであり、セマンティクス(意味論)を持っていない、と。 デスクトップのメタファ デスクトップアプリケーションをプログラミングすることを考えよう。あなたのプログラムはメモリ内のオブジェクトを通じて一連の状態を保持する。もしあなたが現在どのUIエレメントが表示されているかを知りたいならば
要素の追加 (append) insertBefore
<script type="text/javascript"> <!-- window.onload = function() { if (!document.createElement) return; var ele = document.createElement("div"); // 新規に要素（タグ）を生成 var str = document.createTextNode("あいうえお"); // 生成する要素の値（文字列） ele.appendChild(str); // 生成する要素の作成（要素に値を追加） document.body.appendChild(ele); // このページ (document.body) の最後に生成した要素を追加 } // --> </script> 既存のエレメント（要素）に別の要素を追加する場合は createElement() を使用
SelectBoxを初期化する - 技術メモ帳
selectbox.options.length = 0; こうすると、かなり速そうな気がする。 もしかしたら、コレはまったくもって普通のやり方かもしれない。 ただ、以下のようにしてみてるとわかるのだが、 var selectbox = document.createElement('select'); selectbox.options[0] = new Option("key", "value"); // 初期化のつもり selectbox.length = 0; selectbox.options[0] => <option value="value"> 実際には、参照が残ってしまっている。 したがって、おそらく GC に回収されないため メモリリークしていくことだろう。 delete とかすれば良いが、これでは面倒だ。 delete selectbox.options[0]; 追記
趣味のJavaScriptなページ by AYA
JavaScript・Dynamic HTML・Windows Scripting Hostの講座。このサイトはどのページも自由にリンクを張ってもらってけっこうです。 できれば直に張ってください。 これ以下のページはInternet Explorer 5.0、 Netscape Communicator 4.6で表示を確認しています。 フォントサイズは中または12Ptを、 表示色はハイカラー以上を推奨します。 最近、CSSを使ってページを書き換えています。 CSS1対応のブラウザでないとレイアウトがページ作成者の意図と違う可能性大です。 なおNetscape Communicatorをお使いの方はなるべく最新のバージョンでご覧ください。 New! Update! は２ヵ月目安ですが、あくまで目安です。
ノード参照時におけるエラーハンドリング手法を学ぼう
HTML文書から特定のタグ要素を参照する方法と、ノード参照の際のエラー時、その場で処理が終了しないためにすべきこととは何か。 旧来のDHTMLの手法では、JavaScriptから操作できるHTML要素には限りがありましたが、DOMでは、HTML上のありとあらゆる要素を自由自在に読み取ったり、書き換えることができるようになります。本連載では、おもにDOM Level 1で規定されている手法を使い、JavaScriptでどのようにHTML上の要素へアクセスするのか、そして、それをどうやって書き換えるのかを詳しく解説します。これにより、JavaScriptからHTML要素を手に取るように操れるようになります。 前回「HTMLタグ名や属性値からの参照をマスターしよう」では、HTML文書から特定のタグ要素を参照する2つの方法を学びましたが、DOMにはまだほかにも要素を参照するインターフェイスが規定さ
a/javascriptでウィンドウやページ全体の幅や高さを取得する - PukiWiki
komagataのDialog.js † lightboxのパクりだが、動作確認済みというメリットがある ソース Widget.Dialog.prototype._getPageSize = function() {/*{{{*/ var xScroll, yScroll; if (window.innerHeight && window.scrollMaxY) { xScroll = document.body.scrollWidth; yScroll = window.innerHeight + window.scrollMaxY; } else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac xScroll = document.body.scrollWidth
DOMの基本。正しいHTMLとドキュメントツリーを理解しよう
DOMを介してHTMLを操作する方法を理解しよう。そのためには、正しいHTMLの概念とドキュメントツリーを知る必要がある。 旧来のDHTMLの手法では、JavaScriptから操作できるHTML要素には限りがありましたが、DOMでは、HTML上のありとあらゆる要素を自由自在に読み取ったり、書き換えることができるようになります。本連載では、おもにDOM Level 1で規定されている手法を使って、JavaScriptを使ってどのようにHTML上の要素へアクセスするのか、そして、それをどうやって書き換えるのかを詳しく解説していきます。JavaScriptからHTML要素を手に取るように操れるようになります。 ドキュメントツリーとは DOMスクリプティングでは、HTMLに関する正しい知識が求められます。まずは正しいHTMLとはなんなのかを理解していただきます。そして、DOMスクリプティングでは欠
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Amazon.co.jp: jQueryクックブック: jQuery Community Experts (著), 株式会社クイープ (翻訳): 本
