博客列表 >4月3日作业-jquery的常用过滤方法

4月3日作业-jquery的常用过滤方法

时光记忆的博客
时光记忆的博客原创
2018年04月04日 10:22:35631浏览

一、jquery的常用选择方式

    1.$('td').css('background-color','wheat')

    2.$('#title').css('background-color','wheat')

    3.$('.mark').addClass('bg-orange')

    4.$('tr:nth-child(3) ~ *').css('background-color','pink')

二、层级选择器

    1.后代:$('li a').addClass('green')

    2.子元素选择器:$('ul > *').addClasss('green')

    3.相邻吃兄弟选择器:$('li:nth-child(5) + li').addClass('green')

    4.直接选择第一个或则最后一个:$(li:first-child').css();$('li:last').css();

    5.直接命中元素:$('li:nth-child(8)').css()

    6.jquery中元素是从0开始

    7.清除所有元素上已经添加的内联样式style属性:$('*').removeAttr('style')

    8.清除所有元素上的class属性:$('*').removeClass()

    9.选择序号大于某值的元素:$('li:gt(2)').addClass('red')

    10.选择序号小于某值的元素:$('li:lt(7)')

    11.选择偶数结构,看上去是奇数:$('li:even').addClass('red')

    11.选择奇数结构:$('li:odd').addClass()

三、内容过滤器

    1.选择包含指定内容的元素:$('p:contains("春")').addClass()

    2.选择内容为空的元素:$(':empty').addClass()

    3.选择有某个标签的元素:$('p:has("img")').addClass()

    4.选择所有以p为父元素的节点:$('p:parent').addClass('red')

    5.取反过滤器:$(':not(:empty)').css('color','red')

四、表单过滤器

    1.css的选择方法:$('input').css()

    2.jquery的选择方法:$(':input').css,选择<input><textarea><button><select>

    3.css: input = jquery: input:input

    4.选择包含某个类型的元素:$('input[type="password"]').css()

    5.根据表单控件的特征元素来选择元素:$(':file')

    6.直接控制类型选择元素:$(':text').css

    7.只处理表单提交按钮:$('button:submit').css

五、常用的过滤方法(过滤函数)

    1.get()将jquery对象转为DOM对象:$('li').get(1).style.color = 'red'

    2.eq返回指定索引元素,返回的是jquery对象:$('li').eq(2).css('color','red')

    3.first(),last(),无参数:$('li').last().css()

    5.toArray()返回的是DOM数组:var li  = $('li').toArray(); for(var i=0;i<li.length;i++){ li[i].style.color = 'red'}

    6.find():返回所有的后代元素:$('ul').find('li').css()

    7.children()返回所有的直接子元素:$('ul').children('p').css

    8.each(function(){}):  $('li').each(function(){ $(this).css('background-color','wheat')})

    9.元素遍历:$('*').removeAttr('sytle'); $('li').eq(2).next().css(); $('li').eq(2).netAll().css

    10.add(): $('li').add('p').css('color','red')

    11.slice():从集合中获取到一组连续的元素:$('li').slice(2,5).css()


声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议