本实例主要说的还是jquery的选择器，
关于jquery的css的一些知识
用类似
$("li").css("cursor","pointer");这样的方式来确定
具体的大家就看代码
吧
css样式表一
body{background:#000;
color:#fff}
h1{font-size:14px;
color:#fff;font-weight:bold;}
p{font-size:12px;
color:#fff;}body{background:#f00;color:#fff}
h1{font-size:15px;color:#fff;font-weight:bold;}
p{font-size:13px;color:#fff;}body{background:#fee;color:#000}
h1{font-size:16px;color:#000;font-weight:bold;}
p{font-size:14px;color:#000;} 1
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="utf-8">
3<HTML>
4<HEAD>
5 <TITLE>css 选择</TITLE>
6 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
7 <script type="text/javascript" src="/include/jquery/jquery-1.1.3.1.pack.js"></script>
8 <link href="1.css" rel="stylesheet" title="style1" type="text/css" />
9 <link href="2.css" rel="stylesheet" title="style2" type="text/css" />
10 <link href="3.css" rel="stylesheet" title="style3" type="text/css" />
11</HEAD>
12<BODY>
13 <h1>jQuery 是一个新型的JavaScript库. </h1>
14 <p>jQuery是一个简洁快速的JavaScript库，它能让你在你的网页上简单的操作文档、处理事件、运行动画效果或者添加Ajax交互。jQuery的设计会改变你写JavaScript代码的方式。
15jQuery适合于设计师、开发者以及那些还好者，同样适合用于商业开发，可以说jQuery适合任何JavaScript应用的地方，可用于不用的应用程序。
16jQuery是一个轻量级的脚本，其代码非常小巧，JavaScript包只有15K左右。
17jQuery支持CSS1-CSS3,以及基本的xPath
18jQuery是跨浏览器的，它支持的浏览器包括IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+
19</p>
20<ul>
21<li rel="style1" class="styleswitch">styles1</li>
22<li rel="style2" class="styleswitch">styles2</li>
23<li rel="style3" class="styleswitch">styles3</li>
24</ul>
25
<SCRIPT LANGUAGE="JavaScript">
26
<!--
27$('.styleswitch').css("cursor","pointer");
28$('.styleswitch').click(function()
29
{
30switchStylestyle(this.getAttribute("rel"));
31return false;
32
});
33var c = readCookie('style');
34if (c) switchStylestyle(c);
35function switchStylestyle(styleName)
36{
37$('link[@rel*=style][@title]').each(function(i)
38{
39this.disabled = true;
40if (this.getAttribute('title') == styleName) this.disabled = false;
41});
42createCookie('style', styleName, 365);
43}
44function createCookie(name,value,days)
45{
46if (days)
47{
48var date = new Date();
49date.setTime(date.getTime()+(days*24*60*60*1000));
50var expires = "; expires="+date.toGMTString();
51}
52else var expires = "";
53document.cookie = name+"="+value+expires+"; path=/";
54}
55function readCookie(name)
56{
57var nameEQ = name + "=";
58var ca = document.cookie.split(';');
59for(var i=0;i < ca.length;i++)
60{
61var c = ca[i];
62while (c.charAt(0)==' ') c = c.substring(1,c.length);
63if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
64}
65return null;
66}
67function eraseCookie(name)
68{
69createCookie(name,"",-1);
70}
71
//-->
72</SCRIPT>
73</BODY>
74</HTML>
75
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">2
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="utf-8">3
<HTML>4
<HEAD>5
<TITLE>css 选择</TITLE>6
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />7
<script type="text/javascript" src="/include/jquery/jquery-1.1.3.1.pack.js"></script>8
<link href="1.css" rel="stylesheet" title="style1" type="text/css" />9
<link href="2.css" rel="stylesheet" title="style2" type="text/css" />10
<link href="3.css" rel="stylesheet" title="style3" type="text/css" />11
</HEAD>12
<BODY>13
<h1>jQuery 是一个新型的JavaScript库. </h1>14
<p>jQuery是一个简洁快速的JavaScript库，它能让你在你的网页上简单的操作文档、处理事件、运行动画效果或者添加Ajax交互。jQuery的设计会改变你写JavaScript代码的方式。15
jQuery适合于设计师、开发者以及那些还好者，同样适合用于商业开发，可以说jQuery适合任何JavaScript应用的地方，可用于不用的应用程序。16
jQuery是一个轻量级的脚本，其代码非常小巧，JavaScript包只有15K左右。17
jQuery支持CSS1-CSS3,以及基本的xPath18
jQuery是跨浏览器的，它支持的浏览器包括IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+19
</p>20
<ul>21
<li rel="style1" class="styleswitch">styles1</li>22
<li rel="style2" class="styleswitch">styles2</li>23
<li rel="style3" class="styleswitch">styles3</li>24
</ul>25
<SCRIPT LANGUAGE="JavaScript">
26
<!--27
$('.styleswitch').css("cursor","pointer");28
$('.styleswitch').click(function()29
{
30
switchStylestyle(this.getAttribute("rel"));31
return false;32
});33
var c = readCookie('style');34
if (c) switchStylestyle(c);35
function switchStylestyle(styleName)36
{37
$('link[@rel*=style][@title]').each(function(i) 38
{39
this.disabled = true;40
if (this.getAttribute('title') == styleName) this.disabled = false;41
});42
createCookie('style', styleName, 365);43
}44
function createCookie(name,value,days)45
{46
if (days)47
{48
var date = new Date();49
date.setTime(date.getTime()+(days*24*60*60*1000));50
var expires = "; expires="+date.toGMTString();51
}52
else var expires = "";53
document.cookie = name+"="+value+expires+"; path=/";54
}55
function readCookie(name)56
{57
var nameEQ = name + "=";58
var ca = document.cookie.split(';');59
for(var i=0;i < ca.length;i++)60
{61
var c = ca[i];62
while (c.charAt(0)==' ') c = c.substring(1,c.length);63
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);64
}65
return null;66
}67
function eraseCookie(name)68
{69
createCookie(name,"",-1);70
}71
//-->72
</SCRIPT>73
</BODY>74
</HTML>75
浙公网安备 33010602011771号