浏览器兼容性测试小记-DOM篇(一)

简介:
1、childNodes引入空白节点问题:使用childElementCount或children
  2、innerText: FF中不支持该属性,使用textContent代替
  3、变量名与某HTML对象id相同时,引用该变量只会取得id名与其相同的html对象(ie8-);声明变量时前面一律加上var,尽量避免id名与变量名相同
  4、为ele.style.property赋值时一律带上单位:e.style.height= 34 + ‘px’
  5、禁止选择网页内容:
  6、访问form中的元素:ff只支持document.formName.elements['elementName']的方式,ie下可以使用document.formName.item('name');统一使用elements的方式;凡是遇到集合类对象(NodeCollection、NodeList)一律使用collection['name']的方式
  7、自定义html元素特性问题:IE下可以使用e.selfAttr = variable/e.selfAttr方式来设值和取值,FF中只能使用e.setAttribute(attr, value)/e.getAttribute('attr')方式
  8、input元素的type特性问题:IE下该属性是只读的,FF中可以动态设置;一律不能修改,若需要修改则删除原来元素,重新创建新元素
  9、window.location.href问题:就浏览器可以通过这种方式来获取当前页面url;应当统一使用window.location来方位页面url,如:location.hostname,location.port,location.pathname
  10、在浏览器中打开新窗口问题:
  View Code
  11、body载入问题:FF中的body对象在body标签为载入完全时即可访问,IE下必须完全读入后才执行
  12、function、new function(){}、new Function('.....')三者的区别
  13、FF中不支持e.parentElement方式方位父元素,只能使用e.parentNode方式
  14、Table操作问题,IE中无法使用innerHTML方式对table和tr进行操作;一般方法是借助js类库,将innerHLML转化为dom节点,并插入到tbody下
  15、IE下不支持使用e.setAttribute方式来整体设值style属性问题:同时使用e.setAttribute('style', '.......')和e.style.cssText = ‘。。。。。。。’方式来设置
  16、document.createElement('<div class="name"></div>')方式创建html元素在FF中不支持
  17、iframe问题:
  <iframe src="xxx.html" id="frameId" name="frameName" />
  IE 中可以通过window.top.frmaeId或window.top.frameName方式来访问farme;FF中只支持第二种方式;IE在iframe资源未加载完成时无法访问iframe.contentWindow对象
  18、url encoding 问题:encodeURIComponent适用于对url后的参数编码、encodeURI:主要用于location对象跳转时对整个url编码
  19、节点插入问题:IE:insertAdjacentElement(position,src);FF:insertBefore(src, ref)
  20、IE9以下不能访问html元素的构造器,如判断元素是否为HTMLElement方法只能使用:e.nodeType === 1不能使用 e instanceof HTMLElement方式


最新内容请见作者的GitHub页:http://qaseven.github.io/
相关文章
|
2月前
|
Web App开发 编解码 前端开发
面试题22:如何测试Web浏览器的兼容性?
面试题22:如何测试Web浏览器的兼容性?
|
1月前
|
Web App开发 Java 测试技术
《手把手教你》系列基础篇之(四)-java+ selenium自动化测试- 启动三大浏览器(下)基于Maven(详细教程)
【2月更文挑战第13天】《手把手教你》系列基础篇之(四)-java+ selenium自动化测试- 启动三大浏览器(下)基于Maven(详细教程) 上一篇文章,宏哥已经在搭建的java项目环境中实践了,今天就在基于maven项目的环境中给小伙伴们 或者童鞋们演示一下。
66 1
|
1月前
|
Web App开发 Java 测试技术
《手把手教你》系列基础篇之(三)-java+ selenium自动化测试- 启动三大浏览器(上)(详细教程)
【2月更文挑战第12天】《手把手教你》系列基础篇之(三)-java+ selenium自动化测试- 启动三大浏览器(上)(详细教程) 前边宏哥已经将环境搭建好了,今天就在Java项目搭建环境中简单地实践一下: 启动三大浏览器。按市场份额来说,全球前三大浏览器是:IE.Firefox.Chrome。因此宏哥这里主要介绍一下如何启动这三大浏览器即可,其他浏览器类似的方法,照猫画虎就可以了。
44 1
|
6月前
|
Web App开发 前端开发 JavaScript
|
9天前
|
Java 测试技术 定位技术
《手把手教你》系列技巧篇(二十三)-java+ selenium自动化测试-webdriver处理浏览器多窗口切换下卷(详细教程)
【4月更文挑战第15天】本文介绍了如何使用Selenium进行浏览器窗口切换以操作不同页面元素。首先,获取浏览器窗口句柄有两种方法:获取所有窗口句柄的集合和获取当前窗口句柄。然后,通过`switchTo().window()`方法切换到目标窗口句柄。在项目实战部分,给出了一个示例,展示了在百度首页、新闻页面和地图页面之间切换并输入文字的操作。最后,文章还探讨了在某些情况下可能出现的问题,并提供了一个简单的本地HTML页面示例来演示窗口切换的正确操作。
38 0
|
7月前
|
Web App开发 测试技术
Selenium+python之不打开浏览器,来运行测试用例
Selenium+python之不打开浏览器,来运行测试用例
163 0
|
2月前
|
Java 测试技术 C#
常见浏览器兼容性测试工具
常见浏览器兼容性测试工具
|
2月前
|
编解码 缓存 前端开发
Web浏览器的兼容性测试需要考虑哪些测试点?
Web浏览器的兼容性测试需要考虑哪些测试点?
|
3月前
|
Web App开发 Linux 数据安全/隐私保护
Docker本地部署开源浏览器Firefox并远程访问进行测试
Docker本地部署开源浏览器Firefox并远程访问进行测试
147 1
|
3月前
|
Web App开发 测试技术
软件测试/测试开发|edge浏览器首页及新标签页设置
软件测试/测试开发|edge浏览器首页及新标签页设置
49 0