<!DOCTYPE html>
<html>
<head lang="en">
? ? <meta charset="UTF-8">
<title>使用jQuery美化英雄聯(lián)盟簡介頁 </title>
<script type="text/javascript" src="js/jquery-1.12.4.js"></script>
<script type="text/javascript" src="js/index.js"></script>
</head>
<body>
<h1>英雄聯(lián)盟</h1>
<p>? ? 《英雄聯(lián)盟》侦铜，簡稱LOL寞冯。</p>
<p id="content">
? ? 由<strong>Riot Games </strong>開發(fā)，為3D競技場戰(zhàn)游戲鬼贱，其
? ? <span>主創(chuàng)團隊由實力強勁的
? ? ? ? <strong>魔獸爭霸</strong>
? ? ? ? 系列游戲多人<span>即時對戰(zhàn)</span>自定義地圖開發(fā)團隊
? ? </span>...
? ? <a href="#">更多詳情</a>
</p>
<h2>目錄</h2>
<ul class="txt_box">
? ? <li class="current">開發(fā)團隊</li>
? ? <li>游戲周邊</li>
? ? <li>游戲介紹</li>
? ? <li>配置需求</li>
? ? <li>游戲背景</li>
</ul>
</body>
</html>
// JavaScript Document
$(document).ready(function() {
? ? $("p").click(function(){
$(".txt_box .current").css({
"background-color":"#6FF"
});
$("p>span").css({
"background-color":"#f9f"
});
$("h1+p").css({
"background-color":"#ff6"
});
$("span span").css({
"background-color":"#f00","color":"#fff"
});
});
});
