JS:DOMを使ったJavaScriptによる文字の書きこみ
JavaScript・XHTML・CSS (43 items)
2005年11月17日
まずは、document.writeによる書きこみを思いつきます。
※以下、”TEST”という文字をhtmlに書きこむ例です。
document.write('TEST');
で、最近流行のAjaxをちょっとかじり気味に文字を書こうかなとかなると、
innerHTMLで書く事も出来ます。
document.body.innerHTML = 'TEST';
でも、もっとAjaxを駆使して色々やってくと、
DOMを使った書き込みになってくるでしょうね。
var body = document.getElementsByTagName('body');
var item = body.item(0);
var text = document.createTextNode('TEST');
item.appendChild(text);
※”<a href="http://www.web-artisan.jp/">Web Artisan</a>”を書く例。
・document.write
document.write('<a href="http://www.web-artisan.jp/">Web Artisan</a>');
・innerHTML
document.body.innerHTML = '<a href="http://www.web-artisan.jp/">Web Artisan</a>';
・DOM
var body = document.getElementsByTagName('body');
var item = body.item(0);
var text = document.createTextNode('Web Artisan');
var a = document.createElement('a');
var href = a.setAttribute('href', 'http://www.web-artisan.jp/');
a.appendChild(text);
item.appendChild(a);
DOMを使うと一見ややこしそうですが、
最終的には一番柔軟にhtmlを加工できます。
この記事に関連した過去記事一覧は画面下にあります。
Comments
コメントは、まだ書かれていません
Add Comments
Trackback
ネットビジネス用CGI Perl HTML Javascriptの情報サイト wrote:
JavaScriptの演算子:
今回から数回に分けて、JavaScriptで使用する演算子について書いていきます。
JavaScriptで使用される演算子は、CGI、PerlやC言語によく似ています。
JavaScriptの演算子は、VisualBasicなど他の言語を使用されていた方には使用したことがない演算子も出てくるので、覚えておくとよいでしょう。
また、プログラムを書いた事が無いという方のために、簡単な例を用意しました。
a = b + c
プログラムを記述した事の無い方には、変数「a」の値と変数「b」「c」の和が等しい。
と言う意味にも捉えられるかもしれませんが、これはプログラムの世界では変数「b」「c」の和を変数「a」へ代入する。
と言う意味になります。
｢もう知っているよ｣と言う人もおられるでしょうね。
そういう方は、どんどん進んでいって下さいね。
こういった考え方に初めて触れた方は、なれないうちはまようかもしれませんが、プログラムの世界では当たり前の考え方となっているので、なるべく早くなじむようにしましょう。
それでは、JavaScriptの演算子を一つ一つ説明していきます。
2006年03月19日 12時51分29秒
Trackback URL
http://www.res-system.com/weblog/action.php?action=plugin&name=TrackBack&tb_id=532