码迷,mamicode.com
首页 > Web开发 > 详细

jquery

时间:2018-10-21 11:21:30      阅读:177      评论:0      收藏:0      [点我收藏+]

标签:microsoft   inner   对象   option   soft   move   foo   style   div   

jQuery 对象就是通过jQuery包装DOM对象后产生的对象。jQuery 对象是 jQuery 独有的如果一个对象是 jQuery 对象那么它就可以使用 jQuery 里的方法: $(“#test”).html();

jquery的基础语法:$(selector).action()

 

选择器

 基本选择器    

$("*")  $("#id")   $(".class")  $("element")  $(".class,p,div")

 层级选择器   

$(".outer div")  $(".outer>div")   $(".outer+div")  $(".outer~div")

基本筛选器    

$("li:first")  $("li:eq(2)")  $("li:even") $("li:gt(1)")

 属性选择器 

$(‘[id="div1"]‘)   $(‘["alex="sb"][id]‘)

表单选择器    

$("[type=‘text‘]")----->$(":text")         注意只适用于input标签  : $("input:checked")

 筛选器

过滤筛选器 

$("li").eq(2)  $("li").first()  $("ul li").hasclass("test")

 查找筛选器

$("div").children(".test")         $("div").find(".test")  
                               
$(".test").next()        $(".test").nextAll()    $(".test").nextUntil()

$("div").prev()        $("div").prevAll()    $("div").prevUntil()

$(".test").parent()        $(".test").parents()    $(".test").parentUntil()
$("div").siblings()

 操作元素(属性,css,文档处理)

属性操作

--------------------------属性
$("").attr();
$("").removeAttr();
$("").prop();
$("").removeProp();
--------------------------CSS类
$("").addClass(class|fn)
$("").removeClass([class|fn])
--------------------------HTML代码/文本/值
$("").html([val|fn])
$("").text([val|fn])
$("").val([val|fn|arr])
---------------------------
$("").css("color","red")

文档处理

//创建一个标签对象
    $("<p>")


//内部插入

    $("").append(content|fn)      ----->$("p").append("<b>Hello</b>");
    $("").appendTo(content)       ----->$("p").appendTo("div");
    $("").prepend(content|fn)     ----->$("p").prepend("<b>Hello</b>");
    $("").prependTo(content)      ----->$("p").prependTo("#foo");

//外部插入

    $("").after(content|fn)       ----->$("p").after("<b>Hello</b>");
    $("").before(content|fn)      ----->$("p").before("<b>Hello</b>");
    $("").insertAfter(content)    ----->$("p").insertAfter("#foo");
    $("").insertBefore(content)   ----->$("p").insertBefore("#foo");

//替换
    $("").replaceWith(content|fn) ----->$("p").replaceWith("<b>Paragraph. </b>");

//删除

    $("").empty()
    $("").remove([expr])

//复制

    $("").clone([Even[,deepEven]])

css操作

CSS
        $("").css(name|pro|[,val|fn])
    位置
        $("").offset([coordinates])
        $("").position()
        $("").scrollTop([val])
        $("").scrollLeft([val])
    尺寸
        $("").height([val|fn])
        $("").width([val|fn])
        $("").innerHeight()
        $("").innerWidth()
        $("").outerHeight([soptions])
        $("").outerWidth([options])

事件

 

jquery

标签:microsoft   inner   对象   option   soft   move   foo   style   div   

原文地址:https://www.cnblogs.com/roygood/p/9824362.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!