Salinan kode adalah sebagai berikut:
<! Doctype html public "-// w3c // dtd xhtml 1.0 transisi // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html xmlns = "http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv = "konten-tipe" content = "text /html; charset = gb2312" />
<title> </title>
<tautan href = "css/style.css" rel = "stylesheet" type = "text/css"/>
<!-Memperkenalkan jQuery->
<skrip src = "../ skrip/jQuery-1.3.1.js" type = "text/javascript"> </script>
<type skrip = "Teks/JavaScript">
// <! [CDATA [
$ (function () {
var $ div_li = $ ("Div.tab_menu ul li");
$ div_li.click (function () {
$ (ini) .addclass ("dipilih") // elemen <li> saat ini disorot
.siblings (). Removeclass ("dipilih");
indeks var = $ div_li.index (ini); // Dapatkan indeks elemen <li> yang saat ini diklik di semua elemen Li.
$ ("Div.tab_box> Div") // Pilih node anak. Jika simpul anak tidak dipilih, kesalahan akan disebabkan. Jika ada div di dalamnya
.eq (index) .show () // tunjukkan elemen <div> yang sesuai dengan elemen <li>
.siblings (). Hide ();
}). hover (function () {
$ (ini) .addclass ("hover");
},fungsi(){
$ (ini) .removeclass ("hover");
})
})
//]]>
</script>
</head>
<body>
<div>
<div>
<ul>
<li> Urusan saat ini </li>
<li> Olahraga </li>
<li> Entertainment </li>
</ul>
</div>
<div>
<div> Urusan Saat Ini </Div>
<div> Sports </div>
<div> Entertainment </div>
</div>
</div>
</body>
</html>