jquery css 选择器演示代码

yellowcatzy

yellowcatzy

2016-02-19 13:03

每个人都希望每天都是开心的,不要因为一些琐事扰乱了心情还,闲暇的时间怎么打发,关注图老师可以让你学习更多的好东西,下面为大家推荐jquery css 选择器演示代码,赶紧看过来吧!
效果如图所示:

核心代码:
代码如下:
script type="text/javascript"
$('#one').css("background","#fff");
$('div').css("background","#fff");
$('body div').css("background","#bbffaa");//改变body内所有div的属性
$('div span').css("background","#bbffaa").css("color","red").css("font-size","12px");//改变所有div下的span元素的属性
$('#two .mini').css("background","red");//id为two的div内的所有class为mini的元素的属性
$('#two').siblings("div").css("color","green");//选取#two同辈的div元素,无论前后位置
$('div:first').css("background","red");
$('div:gt(1)').css("background","#fff");//索引值大于1的所有div元素
$('div:lt(1)').css("background","yellow");
$('div:not(.one)').css("color","#cccccc");//改变class不为one的div元素
$('div:even').css("font-size","15px");//索引号为偶数的div
$('div:odd').css("font-size","12px");//索引号为奇数的div
$('div:contains(other)').css("font-size","10px");//设置含有文本other的div元素
$('div:has(.mini)').css("color","#bbffaa");//设置含有class为mini元素的div元素的背景色
$('div:parent').css("color","#ffcccc");//改变含有子元素(包括文本)的div元素的属性
$('div:hidden').show(3000);//获取隐藏的div
$('div:visible')//获取可见的div
$("div[title=test]").css("background","black");//设置title为test的div
$("div[.mini][title=test]").css("color","red");//设置class为mini title为test的div
/script

完全演示代码:

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
展开更多 50%)
分享

猜你喜欢

jquery css 选择器演示代码

Web开发
jquery css 选择器演示代码

JQuery contains的选择器

Web开发
JQuery contains的选择器

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

jquery 导航条的效果(css选择器控制)

Web开发
jquery 导航条的效果(css选择器控制)

jQuery animate效果演示

Web开发
jQuery animate效果演示

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

jQuery Selectors(选择器)的使用(二、层次篇)

Web开发
jQuery Selectors(选择器)的使用(二、层次篇)

jQuery Selectors(选择器)的使用(一、基本篇)

Web开发
jQuery Selectors(选择器)的使用(一、基本篇)

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

基于jquery的让页面控件不可用的实现代码

基于jquery的让页面控件不可用的实现代码

Java入门及faq__1(4)

Java入门及faq__1(4)
下拉加载更多内容 ↓