zoukankan      html  css  js  c++  java
  • jquery方法整理

    查找:

    $("div").children()          //div中的每个子元素,第一层
    $("div").find("span")        //div中的包含的所有span元素,子子孙孙
    
    $("p").next()              //紧邻p元素后的一个同辈元素
    $("p").nextAll()              //p元素之后所有的同辈元素
    $("#test").nextUntil("#test2") //id为"#test"元素之后到id为'#test2'之间所有的同辈元素,掐头去尾
    
    $("p").prev()                //紧邻p元素前的一个同辈元素
    $("p").prevAll()             //p元素之前所有的同辈元素
    $("#test").prevUntil("#test2")    //id为"#test"元素之前到id为'#test2'之间所有的同辈元素,掐头去尾
    
    $("p").parent()              //每个p元素的父元素
    $("p").parents()             //每个p元素的所有祖先元素,body,html
    $("#test").parentsUntil("#test2")    //id为"#test"元素到id为'#test2'之间所有的父级元素,掐头去尾
    
    $("div").siblings()          //所有的同辈元素,不包括自己

    基本操作属性:

    $("img").attr("src");               //返回文档中所有图像的src属性值
    $("img").attr("src","test.jpg");        //设置所有图像的src属性
    $("img").removeAttr("src");           //将文档中图像的src属性删除
    
    $("input[type='checkbox']").prop("checked", true);    //选中复选框
    $("input[type='checkbox']").prop("checked", false);
    $("img").removeProp("src");            //删除img的src属性

    CSS类:

    $("p").addClass("selected");      //为p元素加上 'selected' 类
    $("p").removeClass("selected");    //从p元素中删除 'selected' 类
    $("p").toggleClass("selected");    //如果存在就删除,否则就添加

    HTML代码/文本/值

    $('p').html();               //返回p元素的html内容
    $("p").html("Hello <b>nick</b>!");  //设置p元素的html内容
    $('p').text();               //返回p元素的文本内容
    $("p").text("nick");           //设置p元素的文本内容
    $("input").val();             //获取文本框中的值
    $("input").val("nick");          //设置文本框中的内容

    样式css操作:

    样式:

    $("p").css("color");              //访问查看p元素的color属性
    $("p").css("color","red");        //设置p元素的color属性为red
    $("p").css({ "color": "red", "background": "yellow" });    //设置p元素的color为red,background属性为yellow(设置多个属性要用{}字典形式)

    位置:

    $('p').offset()             //元素在当前视口的相对偏移,Object {top: 122, left: 260}
    $('p').offset().top
    $('p').offset().left
    $("p").position()           //元素相对父元素的偏移,对可见元素有效,Object {top: 117, left: 250}
    
    $(window).scrollTop()          //获取滚轮滑的高度
    $(window).scrollLeft()         //获取滚轮滑的宽度
    $(window).scrollTop('100')       //设置滚轮滑的高度为100

    事件:

    $("p").click();              //单击事件
    $("p").dblclick();            //双击事件
    $("input[type=text]").focus()    //元素获得焦点时,触发 focus 事件
    $("input[type=text]").blur()     //元素失去焦点时,触发 blur事件
    $("button").mousedown()  //当按下鼠标时触发事件
    $("button").mouseup()  //元素上放松鼠标按钮时触发事件
    $("p").mousemove()     //当鼠标指针在指定的元素中移动时触发事件
    $("p").mouseover()     //当鼠标指针位于元素上方时触发事件
    $("p").mouseout()     //当鼠标指针从元素上移开时触发事件
    $(window).keydown()    //当键盘或按钮被按下时触发事件
    $(window).keypress()   //当键盘或按钮被按下时触发事件,每输入一个字符都触发一次
    $("input").keyup()     //当按钮被松开时触发事件
    $(window).scroll()     //当用户滚动时触发事件
    $(window).resize()     //当调整浏览器窗口的大小时触发事件
    $("input[type='text']").change()    //当元素的值发生改变时触发事件
    $("input").select()    //当input 元素中的文本被选择时触发事件
    $("form").submit()     //当提交表单时触发事件
    $(window).unload()     //用户离开页面时
  • 相关阅读:
    SQL 初级教程学习(二)
    QuartzJobs 如何发布服务
    Net 发布网站中遇到的几点问题
    PWBI--Excel 数据源
    微信小程序资源
    加密和解密之非对称加密
    Js 使用小技巧总结(1)
    路径的读取
    json和Jsonp 使用总结(3)
    json和Jsonp 使用总结(2)
  • 原文地址:https://www.cnblogs.com/shandayuan/p/10454740.html
Copyright © 2011-2022 走看看