DOMから始めるJavaScriptモダン・スクリプティング---目次：ITpro
近年，Ajaxの台頭をきっかけに，JavaScriptを使ったブラウザのリッチ・クライアント化が進んできました。現在では，ページの表示を変化させるだけであれば，ほとんどのことはJavaScriptのみで対処することが可能です。それを実現するのがDOMなのです。 第1回 DOMから始めるモダン・スクリプティングの世界へようこそ 第2回 ブラウザからHTMLはどう見えているかを理解しよう ～ドキュメントツリー～ 第3回 DOMスクリプティングのことはじめ(1) ～要素（タグ）を狙い撃ち～ 第4回 DOMスクリプティングのことはじめ(2) ～これはどんな要素？～ 第5回 DOMを使ってHTMLを自由自在に書き換える 第6回 イベントハンドラから脱却しよう 第7回 スクリプトを完全に分離しよう ～コンテンツ，プレゼンテーション，ビヘイビア～ 第8回 スクリプトのパッケージ化 ～使い回しできるスクリ
DOM 2 Style の JavaScript オブジェクト - IT戦記
CSS のデータを扱う JavaScript を書きたくて作った いろいろと使えそうなので晒しておきます まだ、インタフェースだけですよ＞＜ var JSCSS = {}; // http://www.w3.org/TR/DOM-Level-2-Style/stylesheets.html#StyleSheets-StyleSheet JSCSS.StyleSheet = function(type, disabled, ownerNode, parentStyleSheet, href, title, media) { this.type = type; this.disabled = disabled; this.ownerNode = ownerNode; this.parentStyleSheet = parentStyleSheet; this.href = href; this
DOMの基本。正しいHTMLとドキュメントツリーを理解しよう
DOMを介してHTMLを操作する方法を理解しよう。そのためには、正しいHTMLの概念とドキュメントツリーを知る必要がある。 旧来のDHTMLの手法では、JavaScriptから操作できるHTML要素には限りがありましたが、DOMでは、HTML上のありとあらゆる要素を自由自在に読み取ったり、書き換えることができるようになります。本連載では、おもにDOM Level 1で規定されている手法を使って、JavaScriptを使ってどのようにHTML上の要素へアクセスするのか、そして、それをどうやって書き換えるのかを詳しく解説していきます。JavaScriptからHTML要素を手に取るように操れるようになります。 ドキュメントツリーとは DOMスクリプティングでは、HTMLに関する正しい知識が求められます。まずは正しいHTMLとはなんなのかを理解していただきます。そして、DOMスクリプティングでは欠
IE8 で実装された Selectors API とは何か？ - IT戦記
はじめに IE8 には Selectors API という新しい仕様が実装されました。 ということで、今後 DOM 操作 API の主流になるであろう Selectors API についてまとめておきます。 Selectors API が使えるブラウザ 2008 年 3 月 6 日現在の一覧 WebKit Build Archives | WebKit (開発版の Safari) Windows | Official Site for Microsoft Windows 10 Home & Pro OS, laptops, PCs, tablets & more (IE8 の Beta 版) Selectors API とは Selectors API とは W3C で定義された仕様です。詳細に関してはこちらをどうぞ 簡単に説明すると getElementsByTagName や getE
DOM操作ライブラリ「DOMAssistant 2.6」リリース | エンタープライズ | マイコミジャーナル
DOMAssistantプロジェクトは20日、JavaScript向けDOM操作ライブラリ「DOMAssistant 2.6」をリリースした。 DOMAssistantは、JavaScriptでDOMの操作を簡単に行えるようにするライブラリ。CSSセレクタを用いてDOMの要素を選択する機能を提供しているほか、DOMの操作を行うさまざまなAPIをDOM要素のメソッドとして実装しており、DOM操作を直感的に記述できるようになっている。 今回リリースされた新バージョンでは、特にCSSセレクタを使用した際のパフォーマンスの改善に力が注がれた。その結果、パフォーマンスは改善され、Internet Explorerを除くすべてのブラウザで、同様の機能を持つ他のライブラリよりも高い性能が出るようになったという。また、簡単に利用することが可能なプラグイン機能が追加され、DOMAssistantにオリジナル
第1回 DOMから始めるモダン・スクリプティングの世界へようこそ
本連載では，DOM（Document Object Model）を使ったJavaScriptの新しいコーディング手法について紹介していきます。 近年，AJAXの台頭をきっかけに，JavaScriptを使ったブラウザのリッチ・クライアント化が進んできました。これまでは，サーバー側のプログラムでページを書き換えることで，ブラウザの表示に変化を与えてきました。しかし，現在では，ページの表示を変化させるだけであれば，ほとんどのことはJavaScriptのみで対処することが可能です。それを実現するのがDOMなのです。 ブラウザのリッチ・クライアント化により，JavaScriptに求められる要求は，複雑さを増すばかりです。本連載では，DOMの基礎を学び，DOMならではのコーディング手法について紹介していきます。 まず，第1回ではDOMとは何なのか，そしてDOMで何ができるのかを解説していきます。 DO
Bridge Word
This shop will be powered by Are you the store owner? Log in here
とてもシンプルに自分自身が属する script 要素を取得 - IT戦記
グローバル領域に以下の一行を書く <script> var currentScript = (function (e) { if(e.nodeName.toLowerCase() == 'script') return e; return arguments.callee(e.lastChild) })(document); alert(currentScript); </script>こうすることで、currentScript はこの script 要素を指す。 いちおう説明 DOM は構築されるときに、上から順番に構築される。そして、script タグがあると、 script 要素を構築したあとに、スクリプトを実行する。 つまり、スクリプトが実行されたとき script 要素は今まさに作られたばかりであり、それよりも後ろの要素が存在しない。さらにこの script 要素を含むすべての要
404 Blog Not Found:javascript - DOM時代のdocument.write()
2007年11月17日04:00 カテゴリLightweight Languages javascript - DOM時代のdocument.write() id:amachang++; [JavaScript] とてもシンプルに自分自身が属する script 要素を取得 - IT戦記 こうすることで、currentScript はこの script 要素を指す。 これにより、document.write()をこう書き直せます。 document.getCurrentScript = function(){ return (function (e) { if (e.nodeName.toLowerCase() == 'script') return e; return arguments.callee(e.lastChild) })(document) }; document.write
Bridge Word
This shop will be powered by Are you the store owner? Log in here
IE用のデバッグ ツールバー「DebugBar 5.0ベータ版」の新機能
先日、紹介したIE用のデバッグ ツールバー「Debug Bar」の5.0 ベータ版がリリースしました。 今回のバージョンでは「DOM」の項目の機能強化が行われています。 DebugBar v5.0 beta 1 released ! phpspotにもDebugBar 5.0ベータ版の紹介記事がありますが、掲載されているのは当サイトで紹介したDebugBar 4.1.1の内容とほぼ同じなので、5.0ベータ版で実装された機能について紹介します。 DebugBarの実装済みの機能については、下記を参照ください。 コリス IE用のデバッグ ツールバー -DebugBar phpspot WEB開発に活用できるIE版のFireBug「DebugBar 5.0 beta」を試してみました マイコミジャーナルの紹介記事で「新しくDOMタブが追加されている」とありますが、DOMタブ自体は4.1.1で既に
DOM 読み込み完了時に関数を実行する domready.js
DOM 読み込み完了時に関数を実行する domready.js 配布元:METAREAL[閉鎖] ライセンス:MIT-style license. domready.jsはDOM 読み込み完了のタイミングで、任意の関数を実行できるようにする JavaScript ライブラリになります。 ページの読み込みが終了したイベントを取得するonloadイベントは厳格すぎて少々扱いにくいところがあります。 画像などのすべてのファイルの読み込みを終了してから実行するため、ラグが生じてしまうからである。 この domready.jsを利用すれば、DOM ツリーが構築されたタイミングで、任意の関数を実行できるのでラグが最小限ですむ。 同様の機能をjQueryやmootoolsではサポートしており、Prototyp.jsの最新版も新たにサポートされています。 domready.jsを利用すれば、それらのフレー
JavaScript-XPath をリリースしました！さあ、あなたも XPath を使おう！（解説付き） - IT戦記
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
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
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
