>웹 프론트엔드 >JS 튜토리얼 >JS를 사용하여 페이지 테이블 및 요소를 조작하는 몇 가지 팁_기본 지식

JS를 사용하여 페이지 테이블 및 요소를 조작하는 몇 가지 팁_기본 지식

WBOY
WBOY원래의
2016-05-16 19:19:461051검색

(하나)
IE, Firefox 및 기타 브라우저는 테이블 태그에 대해 다른 작업을 수행합니다. IE에서는 테이블 및 tr의 innerHTML 할당이 허용되지 않습니다. 세 가지 브라우저에 대한 테스트 결과는 다음과 같습니다.

insertRow

IE6: 지원되며, 기본 매개변수는 -1이며, 기본적으로 마지막에 추가됩니다.

FireFox: 지원되지만 기본 매개변수는 지원하지 않습니다.

오페라: 기본 매개변수 지원, 지원하며 기본적으로 전면에 추가됩니다.


AppendChild

IE6: 지원되지 않음

FireFox: 지원되지만 TR을 추가해도 ROWS에는 영향을 미치지 않습니다.

Opera: 지원, 효과는 insertRow(-1)와 동일, ROWS에 영향을 줌

사양을 최대한 따르면 안전하고 적응 가능한 코드를 작성할 수 있습니다.

//테이블에 빈 행을 추가합니다.
var otr = otable.insertRow(-1);
var otd = document.createElement("td");
otd.innerHTML = " ";
otd.className = "XXXX";
otr.appendChild(otd);

이렇게 하면 세 가지 브라우저에서 실행할 수 있습니다.
(3) childNodes 운영
(1)속성 nodeName
Utils.getChildrenByTagName = 함수(노드, 태그 이름) {
var ln = node.childNodes.length;
var arr = [];
for (var z = 0; z if (node.childNodes[z].nodeName == tagName) {
arr.push(node.childNodes[z]);
}
}
반환 도착;
};
(2)속성 ID
함수 getNodeID(부모, ID) {
var ln = parent.childNodes.length;
for (var z = 0; z if (parent.childNodes[z].id == id) {
                                   return parent.childNodes[z];
}
}
null을 반환합니다.
}
(3)속성 클래스 이름

과 같은 클래스에 해당합니다.
함수 getElementsByClassName(node, className) {
var children = node.getElementsByTagName("*");
var elements = new Array();
for (var i = 0; i var child = 어린이[i];
var classNames = child.className.split(" ");
for (var j = 0; j if (classNames[j] == className) {
elements.push(child);
휴식;
}
}
}
요소를 반환합니다.
}
성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.