>  기사  >  웹 프론트엔드  >  크로스 브라우저 개발 경험 요약 (3) "IE 의존성 증후군"을 조심하세요_javascript 스킬

크로스 브라우저 개발 경험 요약 (3) "IE 의존성 증후군"을 조심하세요_javascript 스킬

WBOY
WBOY원래의
2016-05-16 18:27:241050검색
DHTML
DHTML은 프런트 엔드 상호 작용 구현을 크게 촉진하여 페이지 요소를 가져오고 페이지 요소를 동적으로 수정하는 것을 매우 간단하게 만드는 좋은 기능입니다. 하지만 모든 브라우저가 이러한 구문을 이해합니까?
document.all
document.all은 모든 브라우저에서 인식되지 않습니다. 보다 일반적인 코드를 작성하려면 document.getElementById(…)
element.outerText, element를 사용하여 ID를 통해 가져오는 것이 가장 좋습니다. .innerText, element.outerHTML, element.innerHTML
element.outerText, element.innerText, element.outerHTML은 IE에만 ​​고유한 반면, element.innerHTML은 보편적입니다.
다른 브라우저에서 비범용 속성을 사용하려면 다음 코드 구현을 참조하세요.
코드 복사 코드는 다음과 같습니다.

if(!isIE()){
HTMLElement.prototype.__defineGetter__("innerText",
function(){
var anyString = "";
var childS = this.childNodes
for(var i=0; iif(childS[i].nodeType==1)
anyString = childS[i] .innerText;
else if(childS[i].nodeType==3)
anyString = ahildS[i].nodeValue;
return anyString; >}
);
HTMLElement.prototype.__defineSetter__("innerText",
function(sText){
this.textContent=sText;
}
);


document.forms.actionForm.inputName.value
이전에는 document.all.title.value를 사용하여 actionForm이라는 입찰 양식에서 title이라는 입력 필드의 값을 가져왔습니다. document.forms.actionForm.Input.value로 변경해야 하며, 이 방법을 사용하려면 먼저 HTML의 양식 태그가 다른 태그 구조와 완전한 폐쇄 관계를 가지고 있는지 확인해야 합니다.

테이블 작업

moveRow(iSource, iTarget) 메서드 oRow = tableObject.moveRow(iSource, iTarget) 이 메서드는 테이블에서 tr의 동적 순서 조정을 쉽게 구현할 수 있습니다. 하지만 이 방식은 IE 커널 자체에서 구현한 방식으로 DOM 표준 방식이 아니기 때문에 다른 브라우저에는 없는 방식이다. IE의 이러한 고유한 메서드가 사용되는 경우 표준 DOM 노드 조작 메서드인 insertBefore(currobj, beforeObj.nextSibling)로 전환하거나 먼저 HTMLDocument 클래스의 프로토타입에 moveRow 메서드를 구현합니다.


코드 복사 코드는 다음과 같습니다. function getTRArray(){
......
//will 조작이 필요한 tr은 이 메소드의 반환값으로 배열에 넣습니다.
}

function getTRByIndex(sourceELIndex){
var trArray = getTRArray()
var result = trArray[sourceELIndex] ;
return result;
}

if( !isIE && HTMLElement.moveRow == null )
{
//입력 매개변수 설명:
//sourceELIndex: 필수 이동된 tr이 있는 tbody의 행(>=1)
//targetELIndex: tbody에서 이동해야 하는 행(>=1, <= 행 수)
HTMLElement.prototype .moveRow = function(sourceELIndex,targetELIndex)
{
var tbObject = document.getElementById("tbodyEL")
var resultEL; if(sourceELIndex>=targetELIndex)
{//위로 이동
var s = sourceELIndex-1;
var t = targetELIndex-1
}else{
var s = sourceELIndex-1 ;
var t = targetELIndex;
}
var sourceEL = getTRByIndex(s);
var targetEL = getTRByIndex(t)
//alert("begin" sourceELIndex)
//alert("begin" t );
tbObject.insertBefore(sourceEL,targetEL);
resultEL = sourceEL
return resultEL; >
성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.