选择元素:
- $("#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") // 选择显示的
来源: http://www.bubuko.com/infodetail-2821420.html