zoukankan      html  css  js  c++  java
  • jQuery

    一、查找元素

    1、选择器

    1.1基本选择器:

    $("#myDiv")  

    $("div")  

    $(".myClass") 

    $("*")  

    $("div,span,p.myClass"):找到div,span以及p下属性为myclass的标签;

    1.2层级选择器:

    $("form input"):找到form中所有的input  

    $("form > input"):找到form中所有的子级input元素  

    $("label + input"):找到所有跟在 label 后面的input元素

    $("form ~ input"):找到所有与表单同辈的input元素

    1.3基本筛选器:

    $('li:first')  

    $("input:not(:checked)"):找到所有未选中的 input 元素  

    $("tr:even"):找到表格的1、3、5...行(即索引值0、2、4...)  

    $("tr:odd"):找到表格的2、4、6行(即索引值1、3、5...)

    $("tr:eq(1)"):查找第二行

    $("tr:gt(0)")  

    $('li:last'):获取最后一个元素  

    $("tr:lt(2)")

    1.4属性选择器:

    $("div[id]"):找到所有含有 id 属性的 div 元素     

    $("input[name='newsletter']").attr("checked", true)  

    $("input[name!='newsletter']").attr("checked", true)

    2、筛选器

    2.1过滤筛选器:

    $("p").eq(1)  

    $("p").eq(-2)    

    $('li').first()  

    $('li').last()   

    $("ul li").hasclass("test"):如果li中含有test类,返回true

    2.2查找筛选器:

    $("div").children()  

    $("div").children(".selected")  

    $("p").find("span")和$("p span")相同    

    $("p").next():找到p标签后面紧邻的同辈标签  $("p").next(".selected")

    $("div:first").nextAll().addClass("after"):给第一个div之后的所有元素加个类

    $("p").parent()

    $("p").parent(".selected"):查找段落的父元素中每个类名为selected的父元素

    $('li.item-a').parentsUntil('.level-1').css('background-color', 'red')

    $("p").prev()

    $("p").prev(".selected")

    $("div:last").prevAll().addClass("before")

    $('#term-2').prevUntil('dt').css('background-color', 'red');

    $("div").siblings()

    $("div").siblings(".selected")

    二、操作元素

    1、属性操作

    $("img").attr("src"):设置或获取

    $("img").removeAttr("src");删除

    $("input[type='checkbox']").prop("checked"):prop表示获取元素集合中第一个元素的属性值,如果选中,就为True;

    $("p").addClass("selected"):如果需要增加多个类,用空格分开;

    $("p").removeProp(name):删除由prop设置的属性值;

    $("p").removeClass():删除所有的类;

    $('p').html()

    $("p").html("Hello <b>world</b>!")

    $('p').text():返回元素的文本内容

    $("p").text("Hello world!"):设置元素的文本内容

    $("input").val():获取文本框的值

    $("input").val("hello world!"):设置文本框的值

    jquery插件: 

      http://jqueryui.com/

      http://www.jeasyui.com/

  • 相关阅读:
    jstree 的使用(增 删 改 查)
    关于Random 和 List<int>的Exist的方法使用
    编译器错误消息: CS0016: 未能写入输出文件“c:WindowsMicrosoft.NETFramework64v4.0.30319Temporary ASP.NET Files oot1b124ac2fb984fcApp_global.asax.vbtifrrw.dll”--“拒绝访问。 ”
    SQL Server执行动态SQL正确方式
    C#设计模式——简单说(简单工厂模式)
    c#设计模式——简单说(建造者模式)
    nginx将http请求转发到https
    maven出现:Failed to execute goal on project ...: Could not resolve dependencies for project ...
    动态切换element-ui表格中每行的icon
    axios拦截token过期,返回401的情况
  • 原文地址:https://www.cnblogs.com/cqq-20151202/p/5708042.html
Copyright © 2011-2022 走看看