タグ

htmlとDOMに関するt_43zのブックマーク (5)

  • 「Java SE 6完全攻略」番外編 Java SE 6u10の新機能 その18

    前回,JavaからHTMLドキュメントに埋めこんだJavaScriptにアクセスし,HTMLドキュメントのDOMを操作する方法を紹介しました。しかし,DOM操作を行うにはJavaScriptで記述しなければなりません。 そこで,J2SE 1.4で導入されたのが,HTMLドキュメントのDOMを直接Javaから扱うことができるCommon DOM APIです。次世代Java Plug-inではCommon DOM APIも改善されています。ここでは,Common DOM APIの改善点だけでなく,Common DOM API全体について紹介します。 Common DOM API Common DOM APIはJAXPで扱うDOM APIHTML特有のインタフェースなどを加えたAPIです。 たとえば,HTMLドキュメントの全体を表すためにorg.w3c.dom.Documentインタフェースの

    「Java SE 6完全攻略」番外編 Java SE 6u10の新機能 その18
  • HTML要素の位置取得 - elm200 の日記(旧はてなダイアリー)

    趣旨 ウェブページとして描画された HTML 要素の画面上の位置を取得する。一見簡単そうに見えるこの作業が、現在実装されているブラウザ上ではとてつもなく難しい。そのことを以下で説明していく。 情報ソース この問題に関して調べたところ、最もよく出来ているエントリは、susie-t 氏による offsetTop/offsetLeft/offsetParentの闇 である。とてつもない力作で、実に多くのケースにわたって、包括的に探究が行われている。まるで犯人を追跡する刑事のような執拗さである。氏の自己紹介では「ナマケモノのプログラマ」とか謙遜されているが、これはとてもナマケモノにできる仕事ではない。 基中の基として W3C CSS 2.1 の次の章を抑えておきたい。 8 Box model 9 Visual formatting model 10 Visual formatting mode

    HTML要素の位置取得 - elm200 の日記(旧はてなダイアリー)
  • 第5回 DOMを使ってHTMLを自由自在に書き換える:ITpro

    第5回 DOMを使ってHTMLを自由自在に書き換える これまでは,すでにHTML上に存在している要素をDOMを使って参照する方法を見てきました。しかし,参照するだけではページに何も変化をつけることはできません。今回は,HTML上に新たに要素を追加したり,削除する手法を見ていきましょう。 要素を新たに追加する 要素を新たに作るには,まずcreateElementメソッドを使います。引数に要素名を与えることで,指定の要素が作られ,その要素ノードオブジェクトが返されます。createElementメソッドはdocumentオブジェクトに既定されたメソッドですので,次のように使います。

    第5回 DOMを使ってHTMLを自由自在に書き換える:ITpro
  • DOMから始めるJavaScriptモダン・スクリプティング---目次:ITpro

    近年,Ajaxの台頭をきっかけに,JavaScriptを使ったブラウザのリッチ・クライアント化が進んできました。現在では,ページの表示を変化させるだけであれば,ほとんどのことはJavaScriptのみで対処することが可能です。それを実現するのがDOMなのです。 第1回 DOMから始めるモダン・スクリプティングの世界へようこそ 第2回 ブラウザからHTMLはどう見えているかを理解しよう ~ドキュメントツリー~ 第3回 DOMスクリプティングのことはじめ(1) ~要素(タグ)を狙い撃ち~ 第4回 DOMスクリプティングのことはじめ(2) ~これはどんな要素?~ 第5回 DOMを使ってHTMLを自由自在に書き換える 第6回 イベントハンドラから脱却しよう 第7回 スクリプトを完全に分離しよう ~コンテンツ,プレゼンテーション,ビヘイビア~ 第8回 スクリプトのパッケージ化 ~使い回しできるスクリ

    DOMから始めるJavaScriptモダン・スクリプティング---目次:ITpro
  • HTMLの構造をリアルタイムに階層表示してくれる「Live DOM Viewer」:phpspot開発日誌

    Live DOM Viewer HTMLの構造をリアルタイムに階層表示してくれる「Live DOM Viewer」。 HTMLの論理構造を可視化したい場合になかなか使えそうです。 使い方は、一番上のウィンドウにHTMLを入力するだけ。それで、2段目のブロックにHTMLの階層構造をツリー表示してくれ、更に3段目のブロックにプレビュー表示してくれます。 関連エントリ サイトのCSSを見たままリアルタイムに編集するツール色々 CSSベースのフォームテンプレート セクシーなCSSホバーボタンを作成するチュートリアル DIVを垂直方向に中央寄せするCSSサンプル CSSを使い、1枚の画像だけでカラフルなグラデーション背景を作る例 CSSの小技集、20個

  • 1