今天用到一个幻灯片特效，然后发现网页原本使用的jquery特效失效了，于是网上找答案，贴来：
现在有很多个人站长在网上找到各种网页特效,JS的、Jquery的等等有时一个网页使用多个特效时会出现冲突，但是有些人理不出头绪到底哪里出现冲突或者是很多站长不是专业出身或者技术偏薄弱。
所以一种处理方法是换一种特效，当然另一种就是解决冲突保留自己好不容易找到的完美的符合心意的特效效果，下面是我遇到的问题，希望能帮到各位。
function $(id)是构造了一个匿名函数
1 | function $(id){ return document.getElementById(id); } |
1 2 3 | var $ = function (id) { return "string" == typeof id ? document.getElementById(id) : id;}; |
$(id)是js document.getElementById(id)的简写
定义了这个方法 以后调用的时候就可以直接用$(id).innnerHTML
或者$(id).innerText
一般的还有
1 | function c$(o){return document.createElement(o);} |
这些都是简单的封装。这一类js代码会和与JQuery对象获取函数冲突会与JQuery冲突的，导致JQuery获取不了对象，必须更改其中一方代码
该JS的安全写法有：
1 2 3 | var $id = function (id) { return "string" == typeof id ? document.getElementById(id) : id;}; |
和
1 2 3 4 | var $id = function (id) { //避免与jQuery的$函数冲突 return typeof id == "string" ? document.getElementById(id) : id; }; |
然后进行后续JS代码的更改，假若你不想更改太多，可以把
1 | function $(id){ return document.getElementById(id); } |
这段代码更换成以下代码即可。
1 2 3 4 5 6 7 8 9 | function $(id) { if (typeof jQuery == 'undefined' || (typeof id == 'string' && document.getElementById(id))) { return document.getElementById(id); } else if (typeof id == 'object' || !/^\w*$/.exec(id) || /^(body|div|span|a|input|textarea|button|img|ul|li|ol|table|tr|th|td)$/.exec(id)){ return jQuery(id); } return null;} |
