最新文章专题视频专题问答1问答10问答100问答1000问答2000关键字专题1关键字专题50关键字专题500关键字专题1500TAG最新视频文章推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37视频文章20视频文章30视频文章40视频文章50视频文章60 视频文章70视频文章80视频文章90视频文章100视频文章120视频文章140 视频2关键字专题关键字专题tag2tag3文章专题文章专题2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章专题3
当前位置: 首页 - 科技 - 知识百科 - 正文

跨浏览器开发经验总结(三)警惕“IE依赖综合症”_javascript技巧

来源:动视网 责编:小采 时间:2020-11-27 20:49:13
文档

跨浏览器开发经验总结(三)警惕“IE依赖综合症”_javascript技巧

跨浏览器开发经验总结(三)警惕IE依赖综合症_javascript技巧:DHTML DHTML是个好东西,大大方面了前端的交互实现,使得获取页面元素以及动态修改页面元素变的简单无比。但是所有的浏览器都认识这些语法吗? document.all document.all不是所有浏览器都能识别,要写出更通用的代码,最好还是通过id来得到,使用docu
推荐度:
导读跨浏览器开发经验总结(三)警惕IE依赖综合症_javascript技巧:DHTML DHTML是个好东西,大大方面了前端的交互实现,使得获取页面元素以及动态修改页面元素变的简单无比。但是所有的浏览器都认识这些语法吗? document.all document.all不是所有浏览器都能识别,要写出更通用的代码,最好还是通过id来得到,使用docu


DHTML
DHTML是个好东西,大大方面了前端的交互实现,使得获取页面元素以及动态修改页面元素变的简单无比。但是所有的浏览器都认识这些语法吗?
document.all
document.all不是所有浏览器都能识别,要写出更通用的代码,最好还是通过id来得到,使用document.getElementById(…)
element.outerText, element.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的input域值得地方,应该改为document.forms.actionForm.input.value,要这么使用,首先要保证HTML中form标签与其他标签结构上有完整的闭合关系。
Table操作
moveRow ( iSource , iTarget )方法
oRow = tableObject.moveRow ( iSource , iTarget ),这个方法可以很方便实现table中tr的动态顺序调整。但是这个方法是IE内核自己实现的,不是DOM标准方法,所以别的浏览器没有。在使用到了这些IE独有的方法的地方,要么换用标准的DOM节点操纵方式——insertBefore(currobj, beforeObj.nextSibling),要么先在HTMLDocument类的prototype上自己实现一个 moveRow方法:
代码如下:
function getTRArray(){
……
//将需要操纵的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)
{//move up
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+targetELIndex);
//alert("begin"+s+t);
tbObject.insertBefore(sourceEL,targetEL);
resultEL = sourceEL;
return resultEL;
}
}

文档

跨浏览器开发经验总结(三)警惕“IE依赖综合症”_javascript技巧

跨浏览器开发经验总结(三)警惕IE依赖综合症_javascript技巧:DHTML DHTML是个好东西,大大方面了前端的交互实现,使得获取页面元素以及动态修改页面元素变的简单无比。但是所有的浏览器都认识这些语法吗? document.all document.all不是所有浏览器都能识别,要写出更通用的代码,最好还是通过id来得到,使用docu
推荐度:
标签: 浏览器 IE 警惕
  • 热门焦点

最新推荐

猜你喜欢

热门推荐

专题
Top