使用JS技术实现QQ阅读类似的点击展开、收起效果,具体内容如下
一、定义展开函数
showdiv(),
实现点击"全文"按钮,全文展开。1.点击展开函数,需要将触发点击事件的按钮作为参数传入 2.通过传入的按钮,查找其父元素,将其父元素设置为隐藏。 3.将紧跟其父元素之后的元素设置为显示。
二、定义收起函数
hidediv(),
实现点击"收起全文"按钮,全文内容隐藏。1.点击收起函数,需要将触发点击事件的按钮作为参数传入 2.通过传入的按钮,查找其父元素,将其父元素设置为隐藏。 3.将紧跟其父元素之前的元素设置为显示。
注意:为了浏览器兼容,一定要判断找到的节点nodeType是否为元素节点。
效果如图:
代码:
Meta charset="UTF-8">