Jquery

作者: 游_弋 | 来源:发表于2020-01-19 22:57 被阅读0次

    event.preventDefault() 阻止事件的默认行为

    event.stopPropagation() 阻止事件向上冒泡到 DOM 树,阻止任何父处理程序被事件通知

    // 选择器 :odd奇数 :even偶数

    siblings() - 方法返回被选元素的所有同胞元素。 -- siblings('p');返回同胞元素的所有 <p> 元素;

    next() 方法返回被选元素的下一个同胞元素。

    nextAll() 方法返回被选元素的所有跟随的同胞元素。

    nextUntil() 方法返回介于两个给定参数之间的所有跟随的同胞元素。 -- $("h2").nextUntil("h6");h2到h6之间所有的元素;

    eq() 方法返回被选元素中带有指定索引号的元素。

    first() 方法返回被选元素的首个元素。

    last() 方法返回被选元素的最后一个元素。

    filter() 方法允许您规定一个标准。不匹配这个标准的元素会被从集合中删除,匹配的元素会被返回。$("p").filter(".url");

    not() 方法返回不匹配标准的所有元素。

    // dom加载完执行

    $(document).ready(function(){})<==>$(function(){})

    // 常见dom事件 可选参数click,dbclick,mouseenter,mouseleave,hover,keypress,keydown,keyup,submit,change,focus,blur,load,resize,scroll,unload

    $(selector).click(function(){})

    // 隐藏显示  hide隐藏--show显示--toggle切换隐藏显示

    $(selector).hide(speed,callback);

    // 淡入淡出  fadeIn淡入--fadeOut淡出--fadeToggle切换淡入淡出

    $(selector).fadeIn(speed,callback);

    $(selector).fadeTo(speed,opacity,callback); //允许渐变给定不透明度(0--1之间);

    // 滑动  slideDown向下滑动--slideUp向上滑动--slideToggle切换滑动方向

    $(selector).slideDown(speed,callback);

    // 动画  使用相对值需要在值的前面加上 += 或 -=:-- 使用预定义的值设置为 "show"、"hide" 或 "toggle":

    $(selector).animate({params},speed,callback);

    // 停止动画

    可选的 stopAll 参数规定是否应该清除动画队列。默认是 false,即仅停止活动的动画,允许任何排入队列的动画向后执行。

    可选的 goToEnd 参数规定是否立即完成当前动画。默认是 false。

    (被立即停止的动画不会触发回调,被立即完成的动画会触发回调。)

    $(selector).stop(stopAll,goToEnd);

    // 获得、设置内容 - text()、html() 、 val() 、attr()

    $(selector).text() - 设置或返回所选元素的文本内容

    $(selector).html() - 设置或返回所选元素的内容(包括 HTML 标记)

    $(selector).val() - 设置或返回表单字段的值

    $(selector).attr() - 方法用于获取自定义的DOM属性值。

    $(selector).prop() - 方法用于获取自带的DOM属性值。

    回调写法 两个参数: 被选元素列表中当前元素的下标  原来的文本值

    $(".runoob").attr("href", function(i, origValue){

    if(i !== 2) return

    return origValue + "/1111111111";

    });

    // 添加元素  多个 ,号 隔开

    $("p").append("追加文本"); - 被选元素的结尾插入内容(仍然该元素的内部);

    $("p").prepend("在开头追加文本"); - 被选元素的开头插入内容(仍然该元素的内部);

    $("img").after("在后面添加文本"); - 被选元素之后插入内容。

    $("img").before("在前面添加文本"); - 被选元素之前插入内容。

    // 删除元素

    $("#div1").remove(); - 删除被选元素及其子元素。

    $("#div1").empty(); - 删除被选元素的子元素。

    // 获取并设置 CSS 类

    addClass() - 向被选元素添加一个或多个类

    removeClass() - 从被选元素删除一个或多个类

    toggleClass() - 对被选元素进行添加/删除类的切换操作

    css() - 设置或返回样式属性 - 1个参数返回对应属性值 2个参数设置对应属性 {对象写法:设置多个值}

    // 查看元素宽度||高度

    width() - 元素宽度

    innerWidth() - 元素宽度+padding

    outerWidth() - 元素宽度+padding+border  -- 第一个参数为true时 +=margin

    // 向上遍历 DOM 树

    parent() - 方法返回被选元素的直接父元素。

    parents() - 方法返回被选元素的所有祖先元素,它一路向上直到文档的根元素 (<html>)。

    parentsUntil() -方法返回介于两个给定元素之间的所有祖先元素。

    $("span").parentsUntil("div"); - 返回介于 <span> 与 <div> 元素之间的所有祖先元素:

    // 向下遍历 DOM 树

    children() - 方法返回被选元素的所有直接子元素。

      第一个参数是过滤  $("div").children("p.1");

    find("span") 方法返回被选元素的后代元素,一路向下直到最后一个后代。

    //AJAX

    $.get(URL,callback);

    $.post(URL,data,callback);

    //附加

    var jq = $.noConflict() 方法会释放对 $ 标识符的控制,这样其他脚本就可以使用它了。 并赋值为变量jq中

    //遍历

    $("li").each(function(){$(this).text()});  forEach同样操作

    相关文章

      网友评论

          本文标题:Jquery

          本文链接:https://www.haomeiwen.com/subject/sojdwctx.html