Home > Article > Web Front-end > Use or || to be compatible with FireFox_JavaScript

Use or || to be compatible with FireFox_JavaScript

WBOYOriginal: 2016-05-16 19:29:21892browse

看例子:

运行代码框
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> </head> <body> <li> <a href="http://www.blueidea.com/articleimg/bbsimg/smile.gif"/></a> <a href="图片地址">打开</a> </li> <li> <a href="http://www.blueidea.com/articleimg/bbsimg/biggrin.gif"/></a> <a href="图片地址">打开</a> </li> <li> <a href="http://www.blueidea.com/articleimg/bbsimg/confused.gif"/></a> <a href="图片地址">打开</a> </li> </body> </html> <script language="javascript" type="text/javascript"> document.body.onclick = function(evt){ evt = evt || window.event; var o = evt.target || evt.srcElement; window.open(o.previousSibling.href || o.previousSibling.previousSibling.href); return false; } </script>
[Ctrl A 全部选择提示：你可先修改部分代码，再按运行]

找到 document.body.onclick = function(evt),
在IE下,这个evt是不会有的,但是在fireFox下(opera下好像也是)会默认传这个参数.在IE下,这个参数是 null ,想兼容,就这样写.

继续向下：
evt = evt || window.event;
在IE下,evt 就会指向:window.event,在fireFox下,就会指向那个默认参数.
因为在IE下 evt || window.event 相当于: null || window.event,结果还是window.event
而在fireFox下,就相当于 evt || null ,结果就是evt

向下看:
o.previousSibling.href || o.previousSibling.previousSibling.href
前面一个表达式用于IE下,后面一个用于FireFox下.
FireFox下,没有preserveWhiteSpace这个属性,即:把空白也当作一个节点,而IE则默认为false,即把空白不看成一个节点.

这里说到了XMLDom,似乎和上面所说的不相关,但是在FireFox下 previousSibling就是空白,除非两个HTML标签之间没有任何形式的空格.

打开
两个之间有换行(属于空格的一种),所以在FireFox下,取下面一个的前一个节点的话,就必须用:
o.previousSibling.previousSibling.href

可能你还是没有看明白,没关系,再举个简单的:

运行代码框
<script> function test(p1,p2,p3){ p1 = p1 || 100; p2 = p2 || "xlingFairy"; return "p1 = " p1 " p2 = " p2 " p3 = " p3; } alert(test()); alert(test(null,null,"blueidea.com")) </script>
[Ctrl A 全部选择提示：你可先修改部分代码，再按运行]

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：Practical application of JavaScript: use of innerHTMl and confirmation prompt_JavaScriptNext article：Practical application of JavaScript: use of innerHTMl and confirmation prompt_JavaScript

See more

Use or || to be compatible with FireFox_JavaScript

Related articles