原帖:http://www.css88.com/archives/1793
页面元素的显示和隐藏在前端开发中经常用到的,原来我是这样写的,
hide: function(el) { el.style.display = "none"; } show: function(el) { el.style.display = "block"; }
这里在show函数上就有个问题,如果元素是display:inline话就有问题了,然后我又改成了:
hide: function(el) { el.style.display = "none"; } show: function(el) { el.style.display = " "; }
这也是经常看到的一种,但是当用CSS类设置元素的display时,是computedStyle,而不属于style对象,方法display=”只是取消style对象的display值;最后记过查找在《精通javascript》找到了一下方法,
/** * 隐藏指定的DOM对象 * @id hide * @param {String} el DOM对象 * @return {none} */ hide: function(el) { el = this.get(el);//获取对象 var curDisplay=this.getStyle(el,"display");//获取对象的display属性值, if(curDisplay!="none"){ el._curDisplay=curDisplay;//增加对象的私有属性_curDisplay用来存放元素隐藏前的display属性值; } el.style.display = "none"; }, /** * 显示指定的DOM对象 * @id show * @param {String} el DOM对象 * @return {none} */ show: function(el) { el = this.get(el); el.style.display = el._curDisplay||""; //取对象的display属性值设置成元素隐藏前的display属性值,如果没有就去“” },
没有评论:
发表评论