javascript FAQ函数(提问+回复)
更新时间：2009年07月21日 23:38:01 作者：
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需再刷新一下页面才能执行]
复制代码 代码如下:
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实现图片网格式渐显、渐隐效果,需要的朋友可以参考下2017-06-06
在本篇文章中，小编给大家分享了关于js隐式转换的相关知识点内容，有兴趣的朋友们参考学习下。2018-09-09
js中getBoundingClientRect的作用及兼容方案详解
这篇文章主要介绍了js中getBoundingClientRect的作用及兼容方案详解，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2018-02-02
这篇文章主要还是继续学习javascript闭包，理解JavaScript的闭包是迈向高级JS程序员的必经之路，需要的朋友可以参考下2015-12-12
这篇文章主要为大家介绍了JavaScript如何给对象加一个只读属性，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2023-06-06
在前端直接读取并原样展示Word文档是一个相对复杂的任务,因为Word文档的格式(如.doc或.docx)与Web技术栈使用的格式(HTML、CSS)不兼容,下面这篇文章主要给大家介绍了关于前端实现word文档预览和内容提取的详细过程,需要的朋友可以参考下2024-05-05
推荐一个封装好的getElementsByClassName方法
这篇文章主要推荐一个封装好的getElementsByClassName方法,需要的朋友可以参考下2014-12-12
这篇文章主要介绍了es6函数中的作用域,结合实例形式分析了es6函数作用域相关原理、用法与操作注意事项,需要的朋友可以参考下2020-04-04
Javascript保存网页为图片借助于html2canvas库实现
借助于html2canvas库，把网页保存为Canvas画布，再把生成的canvas保存成图片，下面的示例，大家可以看看2014-09-09
在前端开发的过程中,不可避免的需要根据前置条件动态加载样式和脚本文件,本文小编就来简单为大家介绍一下实现一下动态加载样式和脚本文件的方法吧2023-09-09
最新评论