🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
# :-: 引入方式 & 写法 ``` html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> </head> <body> <!--引入jquery--> <script src="https://cdn.bootcss.com/jquery/3.3.1/core.js"></script> <script> //当DOM准备就绪时,指定一个函数来执行。 $(function() { // 该写法等同于 .ready(); }); </script> </body> </html> ``` # :-: 特殊的 ``` jquery ready(); 案例:这等价于调用推荐的方式: $(function() { // Handler for .ready() called. }); $(this); //当前对象 toggle() //绑定两个或多个事件处理器函数,以响应被选元素的轮流的 click 事件。如果元素是可见的,切换为隐藏的;如果元素是隐藏的,切换为可见的。 each(); //遍历数据 $.parseJSON( json );        //JSON字符串转为与之对应的JavaScript对象 ``` # :-: 操作属性 ``` jq //获取值 val() //无参数获取值;带参数给当前对象赋值 attr() //1个参数,获取当前属性的值;2个参数给当前属性赋值 //填充值 html() //""清空当前的值,1个参数是赋值 text() //修改标签外 或 被俩个标签包裹 的字 ``` # :-: 绑定事件 ``` jq on(); //第2个参数,是由哪个选择器触发该事件 bind() //给获取的元素,绑定事件 ``` # :-: 隐藏、显示 ``` jq hide(); //隐藏 show(); //显示 ``` # :-: 操作节点【增、删、查、改(先删后增)】 ``` jq find(); //查找x个节点,标签的话直接写标签名,id的话用# appendTo(); //将匹配的元素插入到目标元素的最后面 append(); //和上一个一样,追加节点 parent(); //父节点 remove(); //删除节点 ``` # :-: 操作css ``` jq css(); //改1个样式直接写,改多个样式,将{ "color": "#ff0011", "background": "blue" }放到括号中 ``` # :-: 将jq的属性 改成 对象 ``` jq function foo(options){ jQuery.extend(function(){ {name:"bar"} //用{}将其改成对象 {length:5} {dataType:"xml"} },opeions); }; ``` # :-: 遍历数据 ```jq //data 要循环的数组;i键e值(等同于foreach的key=>value) $.each(data,function(i,e){ console.log(e['id']); }); ``` # :-: ajax ``` jq $.ajax({ //发送ajax url:sendUrl, //url type:'post', //以post发送 data:{'user':sendData}, //要发送的数据。后端接收$_POST['user'] dataType:'json', //返回的数据类型 success:function(res){ console.log(res); } }); ```