memememomo · May 18, 2010 00:42
diff --git a/DOM Memo b/DOM Memo
 <html>
  <head>
    <title>hogehoge</title>
    <script type="text/javascript">
      function init() {
        var element = document.getElementById('test');
        alert('id: ' + element.innerHTML);

        var child_list = element.childNodes;
        for (var i = 0; i < child_list.length; i++) {
             alert('childNodes: ' + child_list[i].nodeName);
        }

        var tag_list = element.getElementsByTagName('div');
        for (var i = 0; i < tag_list.length; i++) {
             alert('TagName: ' + tag_list[i].nodeName);
        }

        var parent = element.parentNode;
        alert('parent: ' + parent.innerHTML);

        var previous = element.previousSibling;
        alert('previousSibling: ' + previous.nodeName);

        var previous_previous = element.previousSibling.previousSibling;
        alert('previousSibling2: ' + previous_previous.nodeName);


        var first = element.firstChild;
        alert('firstChild: ' + first.nodeName);

        var last = element.lastChild;
        alert('lastChild: ' + last.nodeName);



        var new_div = document.createElement('div');
        var textNode = document.createTextNode('挿入テキスト');
        new_div.appendChild(textNode);
        alert('テキスト挿入');
        element.appendChild(new_div);

        var replace_div = document.createElement('div');
        var textNode2 = document.createTextNode('入れ替えテキスト');
        replace_div.appendChild(textNode2);
        alert('テキスト入れ替え');
        element.replaceChild(replace_div, new_div);
      }
    </script>
  </head>

  <body onload="init();">
    <div>
      <h1>hogehoge</h1>
      <div id="test">
        <p>
          fuga
        </p>
        <div>
          piyo
        </div>
      </div>
    </div>
  </body>
 </html>
	<html>
	<head>
	<title>hogehoge</title>
	<script type="text/javascript">
	function init() {
	var element = document.getElementById('test');
	alert('id: ' + element.innerHTML);

	var child_list = element.childNodes;
	for (var i = 0; i < child_list.length; i++) {
	alert('childNodes: ' + child_list[i].nodeName);
	}

	var tag_list = element.getElementsByTagName('div');
	for (var i = 0; i < tag_list.length; i++) {
	alert('TagName: ' + tag_list[i].nodeName);
	}

	var parent = element.parentNode;
	alert('parent: ' + parent.innerHTML);

	var previous = element.previousSibling;
	alert('previousSibling: ' + previous.nodeName);

	var previous_previous = element.previousSibling.previousSibling;
	alert('previousSibling2: ' + previous_previous.nodeName);


	var first = element.firstChild;
	alert('firstChild: ' + first.nodeName);

	var last = element.lastChild;
	alert('lastChild: ' + last.nodeName);



	var new_div = document.createElement('div');
	var textNode = document.createTextNode('挿入テキスト');
	new_div.appendChild(textNode);
	alert('テキスト挿入');
	element.appendChild(new_div);

	var replace_div = document.createElement('div');
	var textNode2 = document.createTextNode('入れ替えテキスト');
	replace_div.appendChild(textNode2);
	alert('テキスト入れ替え');
	element.replaceChild(replace_div, new_div);
	}
	</script>
	</head>

	<body onload="init();">
	<div>
	<h1>hogehoge</h1>
	<div id="test">
	<p>
	fuga
	</p>
	<div>
	piyo
	</div>
	</div>
	</div>
	</body>
	</html>