• jquery常用



    选择元素:

    $("#id").parent(); //父元素
    $("#id").parents(); //全部父节点
    $("#id").parents("p"); //返回是P的父元素
    $("#id").children(); //返回全部子节点
    $("#id").children("p"); //返回是p的子节点
    $("#id").contents(); //返回#id 里面的所有内容 包括节点和文本
    $("#id").contents("p") //返回是p的元素里面的节点和文本
    $("#id").prev();//上一个兄弟节点
    $("#id").prevAll();之前所有兄弟节点
    $("#id").next();// 下一个兄弟节点
    $("#id").nextAll();//之后所有的兄弟节点
    $("#id").sibings(); //所有的兄弟节点
    $("#id").sibings("p") //为P的兄弟节点
    $("#id").find("#test1") //遍历子节点为#test1 的节点

    元素筛选:

    $("ul li").eq(1);// 选取ul li 中匹配的索引顺序是1 的元素 ; 索引顺序从0 开始
    $("ul li").first();// 选取ul li 中匹配的第一个元素
    $("ul li").last();// 选取ul li 中匹配的最后一个元素
    $("ul li").slice(1,4);// 选取索引是 1开始 的 到4结束的节点 不包括1; 负值 (-3,-2) , 则从-2 开始 -3结束 不包括-2
    $("ul li").filter(":even"); //选取ul li 中所有奇数顺序的元素 索引顺序是 偶数
    $("ul li").filter(".class"); //选择 li 中 有类名为class 的节点;

    添加元素:

    append(); //在被选元素的结尾插入内容 元素内部
    prepend();//在被选元素的开头插入内容 元素内部
    after();//在被选元素之后插入内容
    before();//在备选元素之前插入内容

    设置|获取内容:

    html();// html() 获取; // 不能用于表单元素
    html(htmlstring) //设置html内容 以上都不能用于 xml 可以用 xhtml文档 ,
    html(function(index,oldhtml){ index 为索引顺序 oldhtml 为当前索引的html
    // 条件 return html; return 的html 为设置的HTML
    })
    text(); //获取元素的文本内容;包括子元素 // 不能用于表单元素
    text(string);//设置文本内容
    val(); // 获取表单元素 value 值 只能用于表单元素
    html(),text(),val(); 都可以使用回调方式来获取|设置

    遍历:

    each(); 语法: 1,jqeury选择器+each(function(index,item){}) 2,$.each(需要遍历的集合,function(index,item){})
    $("li").each(function(index,selector){}) 对象和数组都可以 // 返回false 则停止循环

    事件绑定:

    选择器.事件名(function(){}) //例: $(".add").click(function(){}) // 不会事件委托
    选择器.on("事件名",function(){}) //
    选择器.one("事件名",function(){}) //只会触发一次
    选择器.one("事件1 事件2 事件3",function(){}) //多个事件绑定一个函数
    选择器.one({事件1:function(){},事件2:function(){}}) //多个事件绑定不同函数
    $(document).on({事件1:function(){},事件2:function(){}},"选择器1,选择器2,选择器3") 绑定多个选择器
    选择器.on("自定义事件名", function(event, 参数){}); //自定义事件
    $("button").click(function(){
    $("p").trigger("事件名",["Anja"]); 触发自定义事件 trigger() 触发所选事件类型
    });
    选择器.on("事件名", {键:值}, 函数名); function 函数名(e){ e.data.键 }; 传递数据到事件
    $("父元素").on("事件名","未创建的子元素",function(){}); //使用于未创建的子元素
    tip: 选择器.off("事件名") 移除所绑定的方法 选择器.off() 移除所有绑定方法
    unbind("事件名") 移除所绑定的方法 unbind() 移除所有绑定方法
    选择器.bind("事件名",function(){}) 没有事件委托不会对新的生效
    选择器.delegate("合法的子元素","事件名",function(){}) //seleector 是必须得 必须有子元素
    选择器.live(function(){}) // .live 方法1.9+已经删除 主要用 on

    判断是否影藏:

    if($("#id").is(":hidden")){} // 返回false|true 判断是否影藏
    if($("#id").is(":visible")) // 是否显示
    $("#id:hidden") // 选择#id影藏的
    $("#id:visible") // 选择显示的

  • 相关阅读:
    (转)eclipse安装jetty
    (转)Java compiler level does not match解决方法
    (转)关于eclipse的TestNG的插件安装方法
    win7 远程桌面连接过程
    (转)IntelliJ IDEA 破解方法
    (转) Eclipse Maven 编译错误 Dynamic Web Module 3.1 requires Java 1.7 or newer 解决方案
    (转)@ContextConfiguration注解说明
    (转)java中/r与/n还有/r/n的区别
    (转)eclipse导入Gradle项目
    tomcat架构分析(valve机制)
  • 原文地址:https://www.cnblogs.com/fengbaba/p/9851642.html
Copyright © 2020-2023  润新知