快捷導(dǎo)航

javascript FAQ函數(shù)(提問(wèn)+回復(fù))

更新時(shí)間：2009年07月21日 23:38:01 作者：

javascript FAQ函數(shù)，當(dāng)點(diǎn)擊問(wèn)題時(shí)顯示下面的回復(fù)內(nèi)容。

效果如下圖：當(dāng)點(diǎn)擊問(wèn)題時(shí)顯示下面的回復(fù)內(nèi)容。

script type="text/javascript"> 
onload = function(){ 
faq(document.getElementsByTagName("dl")[0], "dt", "dd"); 
/* 
* faq函數(shù)：elem是父元素，qTag是標(biāo)題元素，aTag是內(nèi)容元素 
*/ 
} 
function faq(elem, qTag, aTag){ 
aTag = aTag || "dd"; //提供默認(rèn)值，下同 
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; 
//獲得當(dāng)前元素的下一個(gè)元素的引用 
while (next.nodeType != 1) { 
next = next.nextSibling; 
} 
if (next.style.display != "none") { 
next.style.display = "none"; 
} 
else { 
next.style.display = "block"; 
} 
} 
} 
} 
</script> 

測(cè)試代碼：

[Ctrl+A 全選注:引入外部Js需再刷新一下頁(yè)面才能執(zhí)行]

您可能感興趣的文章:

相關(guān)文章

原生JS實(shí)現(xiàn)圖片網(wǎng)格式漸顯、漸隱效果
這篇文章主要介紹了原生JS實(shí)現(xiàn)圖片網(wǎng)格式漸顯、漸隱效果,需要的朋友可以參考下
2017-06-06
js隱式轉(zhuǎn)換的知識(shí)實(shí)例講解
在本篇文章中，小編給大家分享了關(guān)于js隱式轉(zhuǎn)換的相關(guān)知識(shí)點(diǎn)內(nèi)容，有興趣的朋友們參考學(xué)習(xí)下。
2018-09-09
js中g(shù)etBoundingClientRect的作用及兼容方案詳解
這篇文章主要介紹了js中g(shù)etBoundingClientRect的作用及兼容方案詳解，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2018-02-02
繼續(xù)學(xué)習(xí)javascript閉包
這篇文章主要還是繼續(xù)學(xué)習(xí)javascript閉包，理解JavaScript的閉包是邁向高級(jí)JS程序員的必經(jīng)之路，需要的朋友可以參考下
2015-12-12
JavaScript實(shí)現(xiàn)給對(duì)象添加一個(gè)只讀屬性
這篇文章主要為大家介紹了JavaScript如何給對(duì)象加一個(gè)只讀屬性，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪
2023-06-06
前端實(shí)現(xiàn)word文檔預(yù)覽和內(nèi)容提取的詳細(xì)過(guò)程
在前端直接讀取并原樣展示W(wǎng)ord文檔是一個(gè)相對(duì)復(fù)雜的任務(wù),因?yàn)閃ord文檔的格式(如.doc或.docx)與Web技術(shù)棧使用的格式(HTML、CSS)不兼容,下面這篇文章主要給大家介紹了關(guān)于前端實(shí)現(xiàn)word文檔預(yù)覽和內(nèi)容提取的詳細(xì)過(guò)程,需要的朋友可以參考下
2024-05-05
推薦一個(gè)封裝好的getElementsByClassName方法
這篇文章主要推薦一個(gè)封裝好的getElementsByClassName方法,需要的朋友可以參考下
2014-12-12
這篇文章主要介紹了es6函數(shù)中的作用域,結(jié)合實(shí)例形式分析了es6函數(shù)作用域相關(guān)原理、用法與操作注意事項(xiàng),需要的朋友可以參考下
2020-04-04