关于jquery的css的一些知识

服务器-老张      2022-02-07     335

关键词:

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>

























































































关于浏览器的一些知识

    浏览器有很多的功能,可以分为以下几个部分:1.人机交互部分(UI)2.网络请求部分(Socket)3.JavaScript引擎部分(解析执行JavaScript)4.渲染引擎部分(渲染HTML、css等)5.数存储部分(cookie、HTML5中的本地存储Loca... 查看详情

(16-10-09)关于前端的一些基础知识

一、关于前端是做什么的Web前端就是开发页面让用户通过浏览器来浏览和使用的。目前来说,页面主要涉及电脑端和移动端,主要针对Web的结构、行为和表现三个方面来进行开发,其中HTML负责Web的结构,CSS负责Web的表现,JavaScri... 查看详情

菜鸟需要一些关于 php、mysql 编程的知识

】菜鸟需要一些关于php、mysql编程的知识【英文标题】:Anoobneedssomequidanceonphp,mysqlprogramming【发布时间】:2011-05-3006:16:18【问题描述】:我正在开发一个(约会、社交)网站。基本上,它是一个数据库系统,注册用户可以在其中... 查看详情

关于css的一些容易出错的地方

1.关于div嵌套的小知识点#container{width:200px;height:200px;padding:10px;margin:10px;background-color:red;}#bigger{width:300px;height:300px;background-color:blue;}<divid="container"><divid="bigger"> 查看详情

关于css-reset的浅析和个人理解

...                         关于css-reset的浅认识  最近在回顾一些过往的知识,想到css-reset的时候,觉得是时候梳理一下这里面的一些个人看法和知识隐藏点,可能不够全面,但是一些总结还是有... 查看详情

关于bootstrap的入门知识

问:Bootstrap是什么?答:开源的前端框架,就是一些事先写好的css、js等。 问:Bootstrap在哪儿下载?答:官方(https://getbootstrap.com/),中文(http://www.bootcss.com/) 问:Bootstrap怎么用?答:网页中引入css等,然后为html标签... 查看详情

如何自定义构建基于 Jquery 的 javascript API 以及关于 Jquery 中使用的语法的一些问题

】如何自定义构建基于Jquery的javascriptAPI以及关于Jquery中使用的语法的一些问题【英文标题】:howtoCustombuildajavascriptAPIbasedonJqueryandsomequestionsaboutthesyntaxusedinJquery【发布时间】:2011-03-2912:39:57【问题描述】:我带着很多问题来到这... 查看详情

关于积性函数的一些知识

...学学完了),于是决定好好去学习一下这面的知识。例如关于积性函数的知识,就是比较重要的一块内容。定义什么是积性函数?其实它的定义还是很好理解的:若对于一个数论函数(f(x)),已知(f(x)=1),且对于任意互质的正整数(... 查看详情

jquery实现抽奖

用jquery实现抽奖小程序 这些日子,到处都可以看到关于微信小程序的新闻或报到,在博客园中写关于微信小程序的也不少。但是今天我要说的不是微信小程序,而是用简单的jquery写的一个好玩的抽奖小程序。最后介绍了后面... 查看详情

软件构造(复习)——一些关于多线程的知识

写在前面:了解多线程是十分必要的,这篇博文是我对该知识点的一些了解(同时也看了一些相关的Blog),用来复习并巩固相关知识。一、什么是多线程?       多线程,是指从软件或者硬件上实现多... 查看详情

关于文件读取的一些小知识

总所周知,input有一属性type=‘file’,然而我们怎么读取,用户上传的信息呢?下面是我总结的一些步骤:1、获取file對象 varfile=document.querySelector(‘input‘);2、設置change事件 file.onchange=function(){      3、获取file的资源  ... 查看详情

关于newenhancement的一些知识

关于newenhancementsap源程序里也给我们留了很多。以下例句point、section、spot说明这些知识点。1.不管是point还是section都是基于spot的,spot相当于一个增强的容器。2.point创建后没有代码只有一个预留点:ENHANCEMENT-POINTZENH_POINT01SPOTSZENH_S... 查看详情

关于socket的一些知识

  之前不怎么了解Socket,看了篇关于Socket的博客里面讲的还是比较全面的(传送门),里面包括TCP/IP协议族,还有关于Socket中一些函数的参数解释给的也很明确,以及函数的返回类型,其中也讲述了三次握手和四次挥手。  ... 查看详情

关于jquery方面的知识点

jquery向上查找父元素用到的方法:closest()parents()parent()closest()方法获得匹配选择器的第一个祖先元素 [*]parent()函数是只往父级找一层;[*]parents()函数是往父级找多层,一直找到body标签。向下查找子元素用到的方法:find()childre... 查看详情

关于js的一些基础知识点

1.js的数据类型:number,string,boolean,null,undefine,object.2.在数据的循环中:break的作用是中断所有的循环执行循环语句下面的语句。continue跳出当前的循环,执行下一次循环语句。循环执行完。在执行循环语句下面的语句。3.js的弹框有... 查看详情

关于javascript的事件处理一些知识

《JS事件处理》Event对象详细信息:http://www.w3school.com.cn/jsref/dom_obj_event.aspJS原生支持3中绑定事件方式:1.以标签属性形式 <divonclick="clicked(event)"></div> 本质上这种方式是直接执行引号当中的JS语句。2.以DOMObject对象属性赋... 查看详情

关于laravel一些学习小知识

...DB::getQueryLog();dd($log);//打印sql语句 这样就可以了第二:关于Csrf防跨域问题的使用ajax表单传输的时候头部 请求部分使用就是这样,这样就可以防止 查看详情

搜集了一些关于aws不错的知识点

ToolsandServicesMarketLandscapeServiceMatrix与其他云厂商服务命名的一些对比ServiceAWSGoogleCloudGoogleInternalMicrosoftAzureOtherprovidersOpensource“buildyourown”OpenstackVirtualserverEC2ComputeEngine(GCE)VirtualMach 查看详情