`

js document.createElement 浏览器兼容处理

阅读更多
1:innerText
IE支持,FIREFOX不支持
解决办法:用innerHTML,2种浏览器都识别innerHTML
2:document.createElement_x
document.appendChild
在往表里插入行时
FIREFOX支持,IE不支持
解决办法:把行插入到TBODY中,不要直接插入到表
3:setAttribute('style','color:red;')
FIREFOX 支持(除了IE,现在所有浏览器都支持),IE不支持
解决办法:不用setAttribute('style','color:red')
而用object.style.cssText = 'color:red;'(这写法也有例外)
最好的办法是上面种方法都用上,万无一失 ^_^
4:class
setAttribute('class','styleClass')
FIREFOX 支持,IE不支持(指定属性名为CLASS,IE不会设置元素的CLASS属性,相反只使用SETATTRIBUTE时IE自动识别CLASSNAME属性)
解决办法:
setAttribute('className','styleClass')
2 种都用上
5:用setAttribute设置事件
var obj = document.getElementByIdx_x('objId');
obj.setAttribute('onclick','funcitonname();');
FIREFOX 支持,IE不支持
解决办法:
IE中必须用点记法来引用所需的事件处理程序,并且要用赋予匿名函数
如下:
var obj = document.getElementByIdx_x('objId');
obj.onclick=function(){fucntionname();};
这种方法所有浏览器都支持
6:建立单选钮
IE以外的浏览器
var rdo = document.createElement_x('input');
rdo.setAttribute('type','radio');
rdo.setAttribute('name','radiobtn');
rdo.setAttribute('value','checked');
IE:
var rdo =document.createElement_x("<input type='radio' name='radiobtn' value='checked'>");
解决办法:
这一点区别和前面的都不一样。这次完全不同,所以找不到共同的办法来解决,那么只有IF-ELSE了
万幸的是,IE可以识别出document的uniqueID属性,别的浏览器都不可以识别出这一属性。问题解决。
0:共同的一些技巧
在动态建立INPUT型输入元素时,一般是先加入,在设置TYPE。这就有可能出错
好习惯:var btn = document.createElement_x('input');
btn.setAttribut('type','button');
document.getElementByIdx_x('formId').appendChild(btn);
GWT-EXT2.0+struts2+hibernate+ejb++spring
分享到:
评论

相关推荐

    document.createElement()用法及注意事项(ff下不兼容)

    总的来说,`document.createElement()`在处理浏览器兼容性时需要谨慎,尤其是涉及到`input`元素时。遵循最佳实践并利用`setAttribute`来设置属性,可以确保在多种浏览器环境下代码的稳定性和可靠性。

    IE9+已经不对document.createElement向下兼容的解决方法

    在IE9及更高版本中,为了更好地遵循W3C标准,微软对某些方法进行了调整,使得`document.createElement`的行为与其他现代浏览器如Firefox和Chrome保持一致。这可能导致在旧的编写方式下出现兼容性问题,尤其是在尝试...

    document.frames在非IE浏览器中的解决办法

    在处理Web页面中的iframe交互时,`document.frames`虽然在IE浏览器中可用,但由于其非标准性,在其他浏览器中并不支持。为了避免兼容性问题,推荐使用`window.frames`来替代。此外,对于更复杂的场景,如动态创建...

    让更多浏览器支持html5元素的简单方法.docx

    总结来说,为了让老版本的浏览器支持HTML5元素,我们需要结合CSS和JavaScript进行处理。通过设置CSS规则使元素表现为块级元素,以及使用JavaScript创建并注册这些元素,我们可以确保在包括IE在内的各种浏览器中,...

    IE中document.createElement的iframe无法设置属性name的解决方法

    因此,为了确保代码的跨浏览器兼容性,我们需要使用`try...catch`语句来分别处理这两种情况: ```javascript try { var iframe = document.createElement('&lt;iframe name="ifr"&gt;&lt;/iframe&gt;'); } catch (e) { var ...

    JS实现PDF在线预览下载

    let downloadLink = document.createElement('a'); downloadLink.href = 'your-pdf-url'; downloadLink.download = 'your-pdf-name.pdf'; document.body.appendChild(downloadLink); // 需要在body内才能触发...

    javascript将svg转图片代码组件,亲测有效;

    2. **创建`Blob`对象**:SVG内容是文本形式,需要转换为二进制数据才能被浏览器处理。为此,我们可以使用`Blob`接口: ```javascript const blob = new Blob([svgContent], { type: 'image/svg+xml;charset=utf-8'...

    IE 不兼容的几个js问题及解决方法

    在使用JavaScript动态创建`&lt;table&gt;`元素并添加行(`&lt;tr&gt;`)或单元格(`&lt;td&gt;`)时,直接使用`document.createElement()`结合`appendChild()`可能无法在Internet Explorer(IE)中正确显示。 **解决方法:** 为了确保...

    JS document对象简单用法完整示例

    JavaScript中的`document`对象是浏览器提供的全局对象,用于访问和操作HTML文档的各个部分,包括元素、属性、事件等。本篇文章将详细讲解`document`对象的一些基础用法,包括直接和间接获取页面元素的方法。 1. **...

    javascript兼容性总结 转.doc

    【兼容处理】为了在所有浏览器中都能正确地访问和设置 class 属性,可以使用以下方式: ```javascript var myObject = document.getElementById("header"); var myAttribute; if (typeof myObject.className === '...

    开发跨浏览器JavaScript时要注意的问题

    在进行Web开发时,跨浏览器兼容性问题一直是个让人头疼的话题。不同的浏览器对JavaScript的支持程度不一,尤其是在处理DOM元素时,开发者需要特别注意一些细节,确保代码能够在各种浏览器中正常运行。本文将详细介绍...

    html中js点击一键复制功能,兼容各大浏览器

    这是目前推荐的实现方式,它更安全,但需要考虑浏览器兼容性。 ```javascript document.getElementById('copyButton').addEventListener('click', async function() { try { const textToCopy = document....

    Laya和iframe通信.zip

    不过需要注意的是,这些方法都受限于浏览器的安全策略,尤其是跨域限制,因此在实际应用中必须确保安全性和兼容性。 在压缩包中的"report"文件可能是Laya与iframe通信的一个实例或教程,可能包含了具体的代码示例和...

    JS读取XML文件数据并以table形式显示数据的方法(兼容IE与火狐) .zip

    在早期的Web开发中,由于浏览器之间的差异,特别是在处理XML上的差异,这样的兼容性处理是必不可少的。 首先,我们需要了解XML(Extensible Markup Language),它是一种用于存储和传输结构化数据的标准格式。XML...

    手机端PDF展示js(无插件无需安装,兼容各浏览器)

    PDF.js是Mozilla开发的一个开源JavaScript库,用于在Web浏览器中渲染PDF文档,无需任何外部插件或Flash支持。这个库的出现使得开发者可以方便地在手机端展示PDF内容,极大地提升了用户体验,因为用户不再需要安装...

    兼容各浏览器的JS点击复制2018年

    为了确保跨浏览器兼容性,我们需要处理那些不支持`execCommand`方法的浏览器。对于这些情况,可以使用`navigator.clipboard` API,这是Web Clipboard API的一部分,它在现代浏览器中提供了更标准的剪贴板访问方式。...

    javascript的document对象

    ### JavaScript的Document对象详解 在Web开发中,`Document`对象是浏览器提供的核心对象之一,它代表了当前加载的HTML文档,并提供了与该文档交互的方法和属性。掌握`Document`对象的基本用法对于进行前端开发至关...

    js创建日历

    在JavaScript中创建动态日历是一项常见的任务,尤其在网页应用中,日历...记住,这只是一个起点,实际项目中可能需要考虑更多细节,比如处理不同浏览器的兼容性问题、优化性能,以及与服务器通信以获取或存储数据等。

Global site tag (gtag.js) - Google Analytics