Home > Developer > JavaScript
I have been very interested in JS since college, but I have very few practical operations. I have been practicing it today and try to write a tab. During the debugging process, I found that there are a lot of problems when I look at it without training!
The feature is easy to expand. You only need to add the title and content to it and then initialize it automatically.
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <ptml xmlns = "http://www.w3.org/1999/xhtml"> <pead> <meta http-equiv =" content-Type "content =" text/html; charset = gb2312 "/> <title> www.jb51.net performance, structure, and behavior separation tab effect home </title> <script language =" javascript "> window. onload = resetTab; function getTabTitle (tab) {var childNodesList = tab. chil DNodes; var titleNodes = new Array (); var j = 0; var I; for (I = 0; I <childNodesList. length; I ++) {if (childNodesList [I]. nodeName = "H1") {titleNodes [j] = childNodesList [I]; j ++ ;}return titleNodes;} function getTabContent (tab) {var childNodesList = tab. childNodes; var tabContent = new Array (); var j = 0; var I; for (I = 0; I <childNodesList. length; I ++) {if (childNodesList [I]. nodeName = "DIV") {tabContent [j] = chi LdNodesList [I]; j ++;} return tabContent;} function resetTab () {var allDiv = document. getElementsByTagName ("div"); var tab = new Array (); var j = 0; var I; for (I = 0; I <style type = "text/css"> </style> </pead> <body> tab [1] tab [2] tab [3] tab [4] 1 go through the preceding steps, A basic CHM file has been created. You can complete some functional settings before compilation, as described below. Two categories of Martial Arts Exhibition Area Categories of martial arts exhibition area Martial Arts Exhibition Area 3 after the aforementioned steps, a basic CHM file has been prepared, you can also set some complete functions before compilation, as described below. 4 categories wugong Exhibition Area Categories wugong exhibition area </body> </ptml>
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
