zoukankan      html  css  js  c++  java
  • jQuery总结(暂时还不全)

    找标签
    jQuery找标签和CSS找标签的方式有些类似
    $("a,#d1") 找到a标签和id为d1的标签,相当于CSS选择器的组合选择器
    $("form input") 找到form标签中的所有input标签
    $("form>input") 找到包裹在form标签中的input标签
    $("label+input") 找到紧挨在label标签后面的input标签
    $("label~input") 找到label标签同级的input标签(兄弟标签)
    jQuery对象和DOM对象的相互转换 jQuery对象保存到变量的时候,一般变量名字前面加$符号
    var d1element=document.getElementById("d1") //找到id为d1的标签
    var $d1element=jQuery(d1element) //DOM对象转换成jQuery对象
    var d1element=$d1element[0] ////jQuery对象转换成DOM对象
    筛选器
    $("ul li:first") //找到ul标签下的第一个li标签
    $("ul li:last") //找到ul标签下的最后一个li标签
    $("ul li:eq(3)") //找到ul标签下索引为3的li标签
    $("ul li:even") //找到ul标签下索引为奇数的li标签
    $("ul li:odd") //找到ul标签下索引为偶数的li标签
    $("ul li:gt(3)") //找到ul标签下索引大于3的li标签
    $("ul li:lt(3)") //找到ul标签下索引小于3的li标签
    $("#d2 p:not(.c2)") //在id为d2的标签内找到所有不含c2属性的p标签
    $("#d2 p:has(a)") //在id为d2的标签内找到所有包含a标签的p标签
    $("#d1").prev() //id为d1标签的上一个标签
    $("#d1").prevAll() //id为d1标签的上面所有标签
    $("#d1").prevUntil("#i3") //id为d1标签的上面所有标签,直到找到id为i3的标签停止寻找
    $("#d1").next() //id为d1标签的下一个标签
    $("#d1").nextAll() //id为d1标签的下面所有标签
    $("#d1").nextUntil("#i3") //id为d1标签的下面所有标签,直到找到id为i3的标签停止寻找
    $("#d1").parent().parent() //id为d1标签的父标签的父标签,(链式查找)
    $("#d1").parents() //id为d1标签的所有父辈标签,(一直向上找到html标签)
    $("#d1").children() //儿子们
    $("#d1").siblings() //兄弟们
    $("#d1").find("p") //id为d1标签里面的p标签



    属性选择器
    $("input[name='hobby']") // 找到name属性等于hobby的input框
    表单常用筛选
    $(":text") // 找到type=text的input框
    ...
    ...
    $(":text") // 找到type=button的input框
    $(":disabled") // 找到含有disabled的input框
    $(":checked") // 找到已被选中的checkbox框

    jQuery操作样式类
    $("d1").addClass("c1") 为id为d1的标签添加c1属性
    $("d1").removeClass("c1") 为id为d1的标签删除c1属性
    $("d1").hasClass("c1") 判断id为d1的标签是否有c1属性(返回true和false)
    $("d1").toggleclass("c1") 判断id为d1的标签是否有c1属性,有就删除,没有就添加




    $('#id').parents(); 父节点
    parent() 方法返回被选元素的直接父元素。
    parents() 方法返回被选元素的所有祖先元素,它一路向上直到文档的根元素 (<html>)。
    $('#id').children(); 子节点
    $('#id').siblings(); 所有的兄弟节点
    $('#id').prev(); 前一个兄弟节点
    $('#id').prevaAll(); 之前所有的兄弟节点
    $('#id').next(); 之后第一个兄弟节点
    $('#id').nextAll(); 之后所有的兄弟节点








  • 相关阅读:
    javascript操作样式
    JavaScript开发
    JavaScript开发
    JavaScript开发
    网页设计
    会员登录界面设计
    用表格模拟实现一个菜鸟教程的网站遇到的问题
    数据库---数据控制语言(DCL)
    数据库---数据库查询的各种子句
    数据库表--增删改查的操作实例
  • 原文地址:https://www.cnblogs.com/QimiSun/p/10067307.html
Copyright © 2011-2022 走看看