**** Artopix.net ****

insertAdjacentHTML

構文 object.insertAdjacentHTML(where, text)

  解説:     要素の中の指定された位置に、指定されたHTMLテキストを挿入し、タグが含まれる場合は、タグにしたがって表示される
  パラメータ
  where      HTMLテキストの挿入位置を指定する文字列で、以下のいずれかを指定できる
  BeforeBegin   要素の直前にテキストを挿入する
  AfterBegin   要素の開始位置の後にテキストを挿入し、その要素中の内容よりも前に置かれる
  BeforeEnd    要素の終了位置の直前にテキストを挿入し、その要素中の内容よりも後に置かれる
  AfterEnd    要素の終了位置の直後にテキストを挿入する
  text      挿入するHTMLテキスト文字列、指定する文字列はテキストとタグを組み合わせる

  戻り値     なし

テーブルセルの値を変化させる

rows.item.cells テーブルセルの値を取り出す


var obj; // DOM
var x;   // 列
var y;   // 行
var str; // 文字列

// IE
obj.rows[y].cells[x].innerHTML = str;

// FireFox, Safari, GoogleChrome
obj.rows.item(y).cells.item(x).innerHTML = str;

// Opera
obj.rows(y).cells(x).innerHTML = str;

function getCell(id, x, y) {
  obj = document.getElementById(id);
  row = obj.rows.item(y);
  cell = row.cells.item(x);
  document.write("cell(" + x + ", " + y + ") is " + cell.firstChild.data);
}

呼び出し getCell('tbl', 1, 0);

<table id="tbl">
<tr><td>[Cell_1]</td><td>[Cell_2]</td></tr>
<tr><td>[Cell_3]</td><td>[Cell_4]</td></tr>
</table>

実行結果 // cell(1,0) is [Cell_1]

addEventListener

MSXML を FireFox で使えるようにするスクリプト

 IE 用のイベントハンドラを追加してテーブルセルの値を取得
 要素数の増減をスクリプトで制御し、アコーディオンタイプのテーブルを作る

 ※ jQuery を使えばもっとシンプルなコードで実現でき、記述も楽
   なので、ここまでしてIEにこだわる必要はないかもしれない
var ie = /MSIE/.test(navigator.userAgent);
var moz = !ie && navigator.product == "Gecko";

		if (moz)
		{
		emulateEventHandlers(["click", "dblclick", "mouseover", "mouseout","mousedown", "mouseup", "mousemove","keydown", "keypress", "keyup"]);
		extendEventObject();
		extendElementModel();
		}


		function emulateEventHandlers(eventNames)
		{
		for (var i = 0; i < eventNames.length; i++)
		{
		document.addEventListener(eventNames[i], function(e){ window.event = e; }, true);
		}
		}

// Extends Event Object * srcElement, cancelBubble, returnValue, fromElement, toElement

		function extendEventObject()
		{
		Event.prototype.__defineSetter__("returnValue", function (b) {
		if (!b) this.preventDefault();
		return b;
		});
		Event.prototype.__defineSetter__("cancelBubble", function (b) {
		if (b) this.stopPropagation();
		return b;
		});
		Event.prototype.__defineGetter__("srcElement", function () {
		var node = this.target;
		while (node.nodeType != 1) node = node.parentNode;
		return node;
		});
		Event.prototype.__defineGetter__("fromElement", function () {
		var node;
		if (this.type == "mouseover")
		node = this.relatedTarget;
		else if (this.type == "mouseout")
		node = this.target;
		if (!node) return;
		while (node.nodeType != 1) node = node.parentNode;
		return node;
		});
		Event.prototype.__defineGetter__("toElement", function () {
		var node;
		if (this.type == "mouseout")
		node = this.relatedTarget;
		else if (this.type == "mouseover")
		node = this.target;
		if (!node) return;
		while (node.nodeType != 1) node = node.parentNode;
		return node;
		});
		Event.prototype.__defineGetter__("offsetX", function () {
		return this.layerX;
		});
		Event.prototype.__defineGetter__("offsetY", function () {
		return this.layerY;
		});
		}

// Extends Element Model * parentElement, Children

		function extendElementModel() {
		HTMLElement.prototype.__defineGetter__("parentElement", function () {
		if (this.parentNode == this.ownerDocument) return null;
		return this.parentNode;
		});
		
		HTMLElement.prototype.__defineGetter__("children", function () {
		var tmp = [];
		var j = 0;
		var n;
		for (var i = 0; i < this.childNodes.length; i++) {
		n = this.childNodes[i];
		if (n.nodeType == 1) {
		tmp[j++] = n;
		if (n.name) {
		if (!tmp[n.name])
		tmp[n.name] = [];
		tmp[n.name][tmp[n.name].length] = n;
		}
		if (n.id)		//
		tmp[n.id] = n
		}
		}
		return tmp;
		});
		
		HTMLElement.prototype.contains = function (oEl) {
		if (oEl == this) return true;
		if (oEl == null) return false;
		return this.contains(oEl.parentNode);
		};
		}

// IE Event Handler

		var cc = "";

		function popup(d)
		{
		var x = window.event.x + 12;
		var y = window.event.clientY + document.body.scrollTop - 5;
		d.style.display = '';
		if ((y + d.clientHeight) - document.body.scrollTop > document.body.clientHeight) {
		y = y - d.clientHeight;
		if (y < document.body.scrollTop) {
		y = document.body.scrollTop + 2;
		}
		}
		d.style.top = y;
		if (d.clientWidth + x > (document.body.clientWidth-4)) {
		d.style.left =  window.event.x - 8 - d.clientWidth;
		d.style.right = window.event.x - 8;
		}else{
		d.style.left =  x;
		d.style.right = x + d.clientWidth;
		}
		}


		function reveal(d)
		{
		try{
		var t;
		for (var i=0; i<document.anchors.length; i++) {
		if (document.anchors[i].name == d) {
		t = document.anchors[i];
		break;
		}
		}
		if (t) {
		var parent = t.parentElement;
		while (parent) {
		if (parent.expandable == '1' && parent.style.display == 'none') {
		folder(parent);
		}
		parent = parent.parentElement;
		}
		}
		}
		catch(e){ }
		}


		function sort(t)
		{
		try{
		var tbody = t.tBodies(0);
		var iColumn = window.event.srcElement.cellIndex;
		var reverse;
		var iRowEnd = tbody.rows.length-1;
		var iSortRowCnt;
		for (var col = 0; col < iColumn; col++) {
		if (tbody.rows[0].cells[col].colSpan > 1) {
		iColumn -= (tbody.rows[0].cells[col].colSpan - 1);
		}
		}
		var key = t.id + "_" + iColumn;
		if (isNaN( tbody.children[0].children[iColumn].innerText.charAt(0))) {
		reverse = false;
		}else{
		reverse = true;
		}
		if (cc == key) {
		cc = "";
		reverse = !reverse;
		}else{
		cc = key;
		}
		var t1 = new Array();
		var t2 = new Array();
		var tab1, tab2;
		var i, j;
		var re =/\D/g;
		iSortRowCnt = 0;
		for (i = 0; i <= iRowEnd; ++i) {
		if (tbody.children[i].child == 'true') {
		continue;
		}
		t1[iSortRowCnt] = new Object();
		if (typeof(tbody.children[i].children[iColumn]) != "undefined") {
		text = tbody.children[i].children[iColumn].innerText;
		}else{
		text = "";
		}
		if (!isNaN(text.charAt(0))) {
		t1[iSortRowCnt].text = eval(text.replace(re, ""));
		t1[iSortRowCnt].isnum = true;
		}else{
		t1[iSortRowCnt].text = text.toLowerCase();
		t1[iSortRowCnt].isnum = false;
		}
		t1[iSortRowCnt].ptr = tbody.children[i];
		iSortRowCnt++;
		}
		tab2 = t1;
		tab1 = t2;
		for (var iSize = 1; iSize < iSortRowCnt; iSize *= 2) {
		var iBeg, iLeft, iRight, iLeftEnd, iRightEnd, iDest;
		if (tab1 == t2) {
		tab1 = t1;
		tab2 = t2;
		}else{
		tab1 = t2;
		tab2 = t1;
		}
		for (iBeg = 0; iBeg < iSortRowCnt; iBeg += iSize*2) {
		iRight = iBeg+iSize;
		if (iRight >= iSortRowCnt) {
		break;
		}
		iRightEnd = iRight+iSize-1;
		if (iRightEnd >= iSortRowCnt) {
		iRightEnd = iSortRowCnt-1;
		}
		iLeftEnd = iRight-1;
		iLeft = iBeg;
		for (iDest = iLeft; iDest <= iRightEnd; ++iDest) {
		if ((iRight > iRightEnd) ||
		(iLeft <= iLeftEnd &&
		compare(tab1[iLeft], tab1[iRight], reverse) <= 0)) {
		tab2[iDest] = tab1[iLeft];
		++iLeft;
		}else{
		tab2[iDest] = tab1[iRight];
		++iRight;
		}
		}
		}
		for (iDest = iRightEnd+1; iDest < iSortRowCnt; ++iDest) {
		tab2[iDest] = tab1[iDest];
		}
		}
		for (i = iSortRowCnt-1; i >= 0; --i) {
		var first = tbody.children[0];
		var insert = tab2[i].ptr, next;
		if (insert == first) {
		continue;
		}
		next = insert.nextSibling;
		while (next && next.child == 'true') {
		tbody.insertBefore(insert, first);
		insert = next;
		next = insert.nextSibling;
		}
		tbody.insertBefore(insert, first);
		}
		}
		catch(e) {
		}
		if (tbody.mode != "child") {
		show(t);
		}
		shade(tbody);
		}


		function compare(elem1, elem2, reverse)
		{
		var sgn = reverse ? -1 : 1;
		if (elem1.isnum && !elem2.isnum) {
		return -1;
		}
		if (elem2.isnum && !elem1.isnum) {
		return 1;
		}
		if (elem1.text < elem2.text) {
		return -sgn;
		}
		if (elem1.text > elem2.text) {
		return sgn;
		}
		return 0;
		}


		function show(t)
		{
		try {
		var tbody = t.tBodies(0);
		var top = document.getElementById("top_"+t.id).value;
		var count = 0;
		var visible = 0;
		
		for (var i=0; i<tbody.rows.length;i++) {
		if (tbody.children[i].child != 'true') {
		children = 0;
		if (count++ < top){
		tbody.children[i].style.display = '';
		visible++;
		}else{
		tbody.children[i].style.display = 'none';
		}
		}else{
		if (tbody.children[i].style.display == '') {
		folder(tbody.children[i]);
		}
		}
		}
		document.getElementById("top_"+t.id).value = visible;
		shade(tbody);
		}
		catch(e){ }
		}


		function shade(tbody)
		{
		var p = 0;
		for (var i = 0; i < tbody.rows.length; i++) {
		if (tbody.children[i].style.display == '') {
		if (tbody.children[i].child != 'true') {
		p++;
		}
		if (p % 2 == 0) {
		className = "b1";
		}else{
		className = "b2";
		}
		if (tbody.children[i].child != 'true' && tbody.children[i].autoshade != 'true') {
		try{
		tbody.children[i].className = className;
		}
		catch(e){ }
		}
		}
		}
		}


		function pressTop(t)
		{
		if (window.event.keyCode == 13) {
		show(t);
		window.event.returnValue = false;
		}
		}
		
		function folder(d)
		{
		try{
		var temp;
		var i = document.getElementById("e_" + d.id);
		if (d.style.display == 'none') {
		d.style.display = '';
		}else{
		d.style.display = 'none';
		}
		if (i.nodeName == "img") {
		temp = i.src;
		i.src = i.altImage;
		i.altImage = temp;
		}else{ 
		var s = document.getElementById("alt_" + i.id);
		temp = i.innerHTML;
		i.innerHTML = s.innerHTML;
		s.innerHTML = temp;
		}
		}
		catch(e) { }
		}


		function hidePAD()
		{
		var i = ocument.getElementById(PAD);
		i.style.display = 'none';
		}
		
		function showPAD(){
		try{
		window.event.cancelBubble = true;
		popup(PAD);
		}
		catch(e){ }
		}