تشاركك الأمثلة في هذه المقالة رمز التنفيذ المحدد لتأثير تبديل علامة تبويب JS للرجوع إليه. المحتوى المحدد كما يلي
<! doctype html> <html> <head> <meta charset = "gb2312"/> <title> Zhu Zhu Made </title> <script src = "js/jquery.js" type = "text/javaScript"> </script> <style> *{margin: 0 ؛ الحشو: 0 ؛ } body {background-color: #fff ؛ Font-Family: "Microsoft Yahei" ؛ حجم الخط: 18 بكسل ؛ العرض: 1000px ؛ الهامش: 50 بكسل Auto ؛ اللون:#000000 ؛ } .wrapper {width: 350px ؛ } #nav ul {border-bottom: 2px solid ellowgreen ؛ الارتفاع: 32 بكسل ؛ } #nav li {display: inline block ؛ الحدود: 2 بكسل Solid #999 ؛ القاع الحدودي: لا شيء ؛ الهامش اليساري: 10px ؛ العرض: 65 بكسل ؛ محاذاة النص: المركز ؛ ارتفاع الخط: 30 بكسل ؛ } #nav li: hover {cursor: pointer ؛ } #content {display: block ؛ الحدود: 1 بكسل الأزرق الصلب. أعلى الحدود: لا شيء ؛ محاذاة النص: المركز ؛ الارتفاع: 100px ؛ رفع الخط: 100px ؛ } #nav li.on {border-bottom: solid 2px #ffffff ؛ } .hide {display: none ؛ } .Show {Display: Block ؛ } </style> </head> <script type = "text/javaScript"> /*Window.onload=Change ؛ // js code enderation function change () {this.nav = document.getElementById ("nav") ؛ this.li = nav.getElementSbyTagName ("li") ؛ this.cont = document.getElementById ("content") ؛ this.divi = cont.getElementSbyTagName ("div") ؛ لـ (var i = 0 ؛ i <li.length ؛ i ++) {li [i] .index = i ؛ li [i] .onclick = function () {for (var i = 0 ؛ i <li.length ؛ i ++) {li [i] .className = "" ؛ divi [i] .className = "Hide" ؛ } li [this.index] .className = "on" ؛ divi [this.index] .className = "show" ؛ }}}*/$ (function () {$ ('#nav li'). كل (function () {$ (this) .click (function () {$ ('#nav li'). removeclass ("on") ؛ $ (this) .addClass ("on" div "). eq ($ (this) .index ()). addClass (" show "). siblings (). addClass (" Hide ") ؛})})}) </script> <body> <viv> <div id =" nav "> ul> <li> num1 </li> </li> id = "content"> <viv> content1 </viv> <viv> content2 </viv> <div> content3 </fiv> <viv> content4 </viv> </viv> </viv> </viv> </body> </tml>ما سبق هو كل شيء عن هذا المقال ، آمل أن يكون مفيدًا لتعلم الجميع.