Jquery如何获取标签属性、增加样式、删除样式，写入文本，教程代码
Jquery获取标签属性，增加样式，删除样式，写入文本代码如下：$(function () {$('#timeline li ul').slideUp(); //$('#timeline li ').removeClass('selected');//var timelineText=$('#timelineText').text();//alert(timelineText);$('#timeline li a').click(function () {//var rel=$(this).attr('rel');//获取rel//var css=$(this).attr('class');//获取class//var timetext=$(this).find('small').text() ; //获取a中的文本/*if ($(this).is('.disabled')){$(this).addClass("selected");//添加selected样式$(this).removeClass("disabled");//删除disable样式//$("#timelineText").text(timetext); //写入文本}else if($(this).is('.selected')){$(this).addClass("disabled");$(this).removeClass("selected");//$("#timelineText").text(timetext); //写入文本}*/if ($(this)){$(this).addClass("selected");$(this).removeClass("disabled");$(this).removeAttr('href');}});});jquery怎么获取相同class的个数？
例如：
<divclass="a"></div>
<divclass="a"></div>
<divclass="a"></div>
想获取class为‘a’的div的个数，可以使用jQuery的length属性:
alert($(".a"))
结果为3
<divclass=c1c2c3>
<aclass=c4>test</a>
</div>
<divclass=c1>
</div>
$(.c1.c2)无空格交集选择同时包含c1,c2class的元素--->会选择到div元素
$(.c1.c4)有空格选择c1的所有后代含有c4的元素--->会选择到a元素
$(c1,c2)逗号并集选择有c1或c2class的元素--->会选择到两个div
jquery动态添加样式
添加CSS的方式有行内式、嵌入式、外链式、导入式
a)动态引入样式表文件：
functionloadLink(url){
varlink=("link");
="text/css";
="stylesheet";
=url;
varhead=("head")[0];
(link);
}
b)嵌入式：
functioninsertStyles(){
vardoc,cssCode=[],cssText;
varlen=;
varhead,style,firstStyle;
if(len==1){
doc=document;
(arguments[0])
}elseif(len==2){
doc=arguments[0];
(arguments[1]);
}else{
alert("函数最多接收两个参数！");
}
head=("head")[0];
styles=("style");
if(==0){
if(){//ie
();
}else{//FF
vartempStyle=("style");
("type","text/css");
(tempStyle);
}
}
firstStyle=styles[0];
cssText=("\n");
if(!+"\v1"){//opacity兼容
varstr=(/opacity:(\d?\.\d+);/);
if(str!=null){
cssText=(str[0],"filter:alpha(opacity="+parEFLoat(str[1])*100+")");
}
}
if(){
+=cssText;
}elseif(){
+=cssText;
}else{
((cssText));
}
}
c)行内式：
varaddStyle=function(ele,str){
vars=("style"),styles;
if(str&&typeofstr==="string"){
if(!s){
=str;
}else{
if(s==[object]){//IE6/("style")返回[object]
s=;
}
styles=trim(s)(";");
for(vari=0,len=;i<len;i++){
varstyle_i=trim(styles[i]);
varattr=style_(":")[0];
if((attr)>-1){
styles[i]="";
}else{
styles[i]=style_i;
}
}
=("")+";"+str;
}
}
}
d)导入式：
import"";
操作CSS类相关的方法：
varhasClass=function(ele,value){
varrclass=/[\n\t\r]/g,
value=""+value+"";
return(==1)&&(""++"")(rclass,"")(value)>-1;
}
vartrim=function(val){
(/(^\s+)|(\s+$)/g,"");
}
varaddClass=function(ele,value){
varrspace=/\s+/,classNames,getClass;
if(value&&typeofvalue==="string"){
classNames=(rspace);
if(===1){
if(!&&==1){
=value;
}else{
getClass=""++"";
for(vari=0,len=;i<len;i++){
varcname=classNames[i];
if(!hasClass(ele,cname)){
getClass+=cname+"";
}
}
=trim(getClass);
}
}
}
}
varremoveClass=function(ele,value){
varrclass=/[\n\t\r]/g,classNames,getClass;
if((value&&typeofvalue==="string")||value===undefined){
classNames=(value||"")(rspace);
if(===1&&){
if(value){//存在查找要移除的类
getClass=""++""(rclass,"");//左右空格，为了使类中各类间均等，方便后面替换
for(vari=0,len=;i<len;i++){
getClass=(""+classNames[i]+"","")
}
=trim(getClass);
}else{//不存在移除所有类
="";
}
}
}
}
vartoggleClass=function(ele,value){
if(typeofvalue==="string"){
if(hasClass(ele,value)){
removeClass(ele,value);
}else{
addClass(ele,value);
}
}
}
jquery怎么使用？
$(#element);// 相当于(element)$();//Class$(p);//html标签$(form > input);//子对象$(div,span,);//同时选择多种对象$(tr:odd)(background-color, #bbbbff);//表格的隔行背景$(:input);//表单对象$(input[name=newsletter]);//特定的表单对象2.对象函数的应用简单和不限制(par)；$(””)(”ohmy”)(”slow”)...3.对已选择对象的操作（包括样式）：$(#element)(selected);//给对象添加样式$(#element)({ background-color:yellow, font-weight:bolder });//改变对象样式$(p)(Some new text.);//改变对象文本$(img)({ src: , alt: Test Image });//改变对象文本$(p)(span);//给对象增加标签$(p)(span);//查找对象内部的对应元素$(p)();//对象的父级元素$(p)(Hello);//给对象添加内容4.支持aJax，支持文件格式：xml/html/script/json/jsonp$(#feeds)();//相应区域导入静态页内容$(#feeds)(, {limit: 25}, function(){alert(The last 25 entries in the feed have been loaded);});//导入动态内容4.对事件的支持：$(p)(function () {$(this)(hilite);//鼠标放上去时}, function () {$(this)(hilite);//移开鼠标});//鼠标放上去和移开的不同效果（自动循环所有p对象）5.动画：$(p)(slow);//隐藏对象(慢速渐变)$(#go)(function(){$(#block)({width: 90%,height: 100%,fontSize: 10em}, 1000 );});//鼠标点击后宽、高、字体的动态变化6.扩展：$ = function(bg){return (background, bg);};$(#element)(red);如果要为每一个jQuery 对象添加一个函数，必须把该函数指派给 $，同时这个函数必须要返回一个 this（jQuery 对象
发表评论