javascript FAQ函数(提问+回复)


效果如下图:当点击问题时显示下面的回复内容。

复制代码 代码如下:

script type="text/javascript">
onload = function(){
faq(document.getElementsByTagName("dl")[0], "dt", "dd");
/*
* faq函数:elem是父元素,qTag是标题元素,aTag是内容元素
*/
}
function faq(elem, qTag, aTag){
aTag = aTag || "dd"; //提供默认值,下同
qTag = qTag || "dt";
elem = elem || document;
var dds = elem.getElementsByTagName(aTag);
for (var i = 0, len = dds.length; i < len; i++) {
dds[i].style.display = "none";
}
var dts = elem.getElementsByTagName(qTag);
for (var i = 0, len = dts.length; i < len; i++) {
dts[i].style.cursor = "hand";
dts[i].onclick = function(){
var next = this.nextSibling;
//获得当前元素的下一个元素的引用
while (next.nodeType != 1) {
next = next.nextSibling;
}
if (next.style.display != "none") {
next.style.display = "none";
}
else {
next.style.display = "block";
}
}
}
}
</script>

测试代码:

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]



相关阅读:
析构函数的作用 什么是析构函数
js创建数据共享接口——简化框架之间相互传值
javascript Excel操作知识点
PHP运行出现Notice : Use of undefined constant 的完美解决方案分享
[PHP]实用函数8
Linux系统管理员必备的知识
input 按钮显示差异的解决方法
asp.net控件开发技巧(2)关闭基类不必要的功能
asp.net 表单验证新思路
php set_time_limit(0) 设置程序执行时间的函数
JavaScript搜索网页表格
Javascript 获取LI里的内容
SQL语句练习实例之四 找出促销活动中销售额最高的职员
dedecms 在内容模板里调用栏目内容即{dede:field.content/}
快速导航

Copyright © 2016 phpStudy | 皖ICP备18014864号-4