日期:2014-05-16 浏览次数:20403 次
var shq = {} shq.cmenu = function(e) { /*1 利用三目运算符简化代码(自己看一下三目运算符 ? : 的运算规则,这条语句等价于: if (window.event) e = window.event.srcElement; else e = e.target; 作用是通过window.event判断浏览器类型,如果window.event有定义,说明是IE浏览器。 srcElement、target属性的作用是一样的,都是对触发事件的元素对象的引用,IE浏览器中定义的是srcElement属性,标准浏览器下定义的是target属性 */ var e = window.event ? window.event.srcElement : e.target; if (/a/i.test(e.tagName)) { // /a/i是正则表达式对象,通过test()方法检查触发事件的元素对象的标签名是否为a(即链接) e.parentNode.className = e.className; //设置e元素的父元素的类属性值为e元素的类属性值 e.parentNode.nextSibling.innerHTML = e.innerHTML; //设置与e元素的父元素同级并且位于父元素后面的邻居对象的内容为e元素的内容 e.parentNode.nextSibling.style.cssText = 'border-top:none'; //设置CSS e.blur(); //使得e元素失去焦点 } }
------解决方案--------------------
①获得事件的元素。这是兼容性写法,IE支持window.event用window.event.srcElement获取事件源,不支持的用e.target获取。
②正则表达式,判断元素是不是a标签。
③把当前元素的class属性赋给其父元素。
④把当前元素的内容赋给其父元素的下一个兄弟元素。
⑤当前元素的父元素的下一个兄弟元素加上样式'border-top:none'。
⑥当前元素失去焦点。
例如,
<span><a class="AAA" href="BBB">CCC</a></span>
<div></div>
执行函数后变成
<span class="AAA"><a class="AAA" href="BBB">CCC</a></span>
<div style="border-top:none">CCC</div>