تصف هذه المقالة مبدأ وتنفيذ تأثير تبديل علامات تبويب JavaScript. شاركه للرجوع إليه.
طريقة التنفيذ المحددة هي كما يلي:
انسخ الرمز كما يلي: <html>
<head>
<type type = "text/css">
#Container {الحدود: Solid 1px Green ؛ العرض: 300px ؛ الارتفاع: 300px ؛}
li {float: اليسار ؛ الهامش اليسار: 20px ؛}
P {Float: Left ؛}
#الرياضة ،#العسكرية ،#bbs {display: none ؛}
</style>
<script type = "text/javaScript">
علامة تبويب الوظيفة (pid) {
var ps = ['News' ، 'Sports' ، 'Military' ، 'BBS'] ؛
لـ (var i = 0 ، len = ps.length ؛ i <len ؛ i ++) {
if (ps [i] == pid) {
document.getElementById (ps [i]). style.display = "block" ؛
}آخر{
document.getElementById (ps [i]). style.display = "none" ؛
}
}
}
</script>
</head>
<body>
<div id = "container">
<ul>
<li onmouseover = "tab ('news') ؛"> الأخبار </li>
<li onmouseover = "tab ('Sports') ؛"> Sports </li>
<li onmouseover = "tab ('Military') ؛"> Military </li>
<li onmouseover = "tab ('bbs') ؛"> forum </li>
</ul>
<p id = "news"> News NewsNews News </p>
<p id = "Sports"> Sports Sports Sports </p>
<p id = "Military"> الجيش العسكري العسكري </p>
<p id = "bbs"> منتدى المنتدى المنتدى المنتدى </p>
</div>
</body>
</html>
آمل أن تكون هذه المقالة مفيدة لبرمجة JavaScript للجميع.