Query实例CSS 样式表动态选择
本实例主要说的还是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;}

css样式表二

body{background:#f00;color:#fff}
h1{font-size:15px;color:#fff;font-weight:bold;}
p{font-size:13px;color:#fff;}

css样式表三

body{background:#fee;color:#000}
h1{font-size:16px;color:#000;font-weight:bold;}
p{font-size:14px;color:#000;}

主要文件代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"  xml:lang="utf-8">
<HTML>
<HEAD>
  <TITLE>css 选择</TITLE>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <script type="text/javascript" src="/include/jquery/jquery-1.1.3.1.pack.js"></script>
  <link href="1.css" rel="stylesheet" title="style1" type="text/css" />
  <link href="2.css" rel="stylesheet" title="style2" type="text/css" />
  <link href="3.css" rel="stylesheet" title="style3" type="text/css" />
</HEAD>
<BODY>
  <h1>jQuery 是一个新型的JavaScript库. </h1>
  <p>jQuery是一个简洁快速的JavaScript库，它能让你在你的网页上简单的操作文档、处理事件、运行动画效果或者添加Ajax交互。jQuery的设计会改变你写JavaScript代码的方式。
jQuery适合于设计师、开发者以及那些还好者，同样适合用于商业开发，可以说jQuery适合任何JavaScript应用的地方，可用于不用的应用程序。
jQuery是一个轻量级的脚本，其代码非常小巧，JavaScript包只有15K左右。
jQuery支持CSS1-CSS3,2881064151以及基本的xPath
jQuery是跨浏览器的，它支持的浏览器包括IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+
</p>
<ul>
<li rel="style1" class="styleswitch">styles1</li>
<li rel="style2" class="styleswitch">styles2</li>
<li rel="style3" class="styleswitch">styles3</li>
</ul>
<SCRIPT LANGUAGE="JavaScript">
<!--
$('.styleswitch').css("cursor","pointer");
$('.styleswitch').click(function()
{
switchStylestyle(this.getAttribute("rel"));
return false;
});
var c = readCookie('style');
if (c) switchStylestyle(c);
function switchStylestyle(styleName)
{
$('link[@rel*=style][@title]').each(function(i) 
{
this.disabled = true;
if (this.getAttribute('title') == styleName) this.disabled = false;
});
createCookie('style', styleName, 365);
}
function createCookie(name,value,days)
{
if (days)
{
var date = new Date();
date.setTime(date.getTime()+(days*24*60*60*1000));
var expires = "; expires="+date.toGMTString();
}
else var expires = "";
document.cookie = name+"="+value+expires+"; path=/";
}
function readCookie(name)
{
var nameEQ = name + "=";
var ca = document.cookie.split(';');
for(var i=0;i < ca.length;i++)
{
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1,c.length);
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
}
return null;
}
function eraseCookie(name)
{
createCookie(name,"",-1);
}
//-->
</SCRIPT>
</BODY>
</HTML>

关于jquery的css的一些知识的更多相关文章

  1. jQuery和CSS 3定制HTML 5视频播放器

    目前,随着越来越多的浏览器开始支持更多的HTML5新特性,开发者也逐渐关注HTML5的开发.在众多HTML5的新特性中,视频方面的新特性是 很值得开发者和用户关注的.现在,只需要有支持HTML5的浏览 ...

  2. jquery-8 jquery如何处理css样式

    jquery-8  jquery如何处理css样式 一.总结 一句话总结: 1.如何获取网页的三个高? 1)可视区域的高$(window).height(); 2)文档总高度$(document).h ...

  3. js进阶 11-4/5 jquery中css的类的操作有哪些

    js进阶 11-4/5  jquery中css的类的操作有哪些 一.总结 一句话总结:jquery中css的类的操作有增删切三种. 1.jquery中css的类的操作有哪些? 增删切三种 addCla ...

  4. js进阶 11-3 jquery中css属性如何操作

    js进阶 11-3  jquery中css属性如何操作 一.总结 一句话总结:通过css()方法 1.attr和css是有交叉的,比如width,两者中都可以设置,那么他们的区别是什么? 其实通俗一点 ...

  5. jQuery属性/CSS使用例子

    jQuery属性/CSS 1..attr() 获取匹配的元素集合中的第一个元素的属性的值  或 设置每一个匹配元素的一个或多个属性. 例1:获取元素的属性的值 <p title="段落 ...

  6. jquery的css详解（二）

    jq的工具方法style用于设置样式,jq的实例方法css在设置样式时就是调用的它,接下来分析一下源码. jQuery.extend({ ............................ st ...

  7. jquery的css详解（一）

    通过阅读源码可以发现css是jq的实例方法.而在内部调用jq的工具方法access来实现的,对该方法不了解的朋友请点击 -> jquery工具方法access详解 在access的回调中做了一个 ...

  8. jquery修改css样式，样式带!important

    由于需求的需要,今天在用jquery修改一个弹出框的样式的时候,由于有一个按钮有padding-left:12px;导致内间距空出来的这一块颜色用普通的方式无法改变. 普通的jquery修改css的方 ...

  9. 使用jquery修改css中带有!important的样式属性

    当CSS中含有!important的样式属性时,普通的修改方式是会出现失败的.如下: <div class="test">使用jquery修改css中带有!import ...

随机推荐

  1. windows7 安装IIS没有default web site 解决方法

    因当时是第一次在Windows 7上使用IIS,不小心把default web site删除了,后来无论怎么重装IIS都不行,最后想到能不能直接把别人安装好后的IIS相关文件夹拷过来使用,用宿舍一哥们 ...

  2. ECharts 3 -- gauge表盘的配置项

    绘制一个简单的表盘图表 在绘图前我们需要为 ECharts 准备一个具备高宽的 DOM 容器. <body> <!-- 为 ECharts 准备一个具备大小(宽高)的 DOM --& ...

  3. 在SSH框架中，如何得到POST请求的URL和参数列表

    在做项目的API通知接口的时候,发现在SSH框架中无法获取到对方服务器发来的异步通知信息.最后排查到的原因可能是struts2对HttpServletRequest进行了二次处理,那么该如何拿到pos ...

  4. 彻底关闭Google的安全搜索

    在使用简体中文的情况下,访问Google总是会跳转到香港,这个时候的安全搜索是无法关闭的. 下面介绍一个最简单的方法,直接使用Google的中文界面:https://www.google.com/we ...

  5. hive操作

    1.创建hive分区表: create table invites (id int, name string) partitioned by (ds string) row format delimi ...

  6. [SublimeText] Sublime Text 2 在 Ubuntu 上安装指南

    1. 下载Sublime Text 2 在官网下载对应系统位数的版本,从压缩包中提取出源代码,解压后文件夹中的"sublime_text"双击即可直接运行. 2. 建立快捷链接 将 ...

  7. call()、apply()、bind()

    1.均可以改变函数的执行上下文,也就是this值: 2.call()  apply() function apply(num1, num2){ return sum.apply(this, [num1 ...

  8. Android设置横屏竖屏

    getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FUL ...

  9. Win8交互UX——触摸板交互

    针对触摸输入优化 Window 应用商店应用设计,并在默认情况下获得触摸板支持. 设计用户可以通过触摸板交互的 Windows 应用商店应用. 触摸板结合间接的多点触控输入和指针设备(如鼠标)的精确输 ...

  10. Excel中countif函数的使用方法

    1.countif函数的含义 在指定区域中按指定条件对单元格进行计数(单条件计数) 建议和countifs函数结合起来学习,可以观看小编的经验Excel中countifs函数的使用方法. END 2. ...