JQuery：表單篩選器、篩選器方法、樣式操做、位置操做、尺寸相關、文本操做、屬性操做、文檔處理、克隆、事件等
表單篩選器：css
主代碼：html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script> </head> <body> <!--novalidate 告訴瀏覽器不要幫你作額外的數據校驗--> <form action=""> <p><label for="d1">username:<input type="text" id="d1" disabled></label></p> <p><label for="d2">password:<input type="password" id="d2"></label></p> <input type="submit"> <input type="checkbox" name="hobby">籃球 <input type="checkbox" name="hobby" checked>足球 <input type="checkbox" name="hobby">肉球 <select name="" id=""> <option value="">111</option> <option value="" selected>222</option> <option value="">333</option> </select> </form> </body> </html>
篩選器方法：jquery
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script> </head> <body> <span>span1</span> <span>span2</span> <div id="d1">div <span>div>span</span> <p class="c1">div>p <span class="c2">div>p>span</span> </p> <span id="d2">div>span</span> </div> <span>span1</span> <span>span2</span> <span id="d3"></span> </body> </html>
$("#id").parents() // 查找當前元素的全部的父輩元素
報錯緣由：ios
由於.children()是JQuery對象的方法，前面獲得的是js原生對象，因此要轉成JQuery對象才能調用.children()方法。git
補充方法：github
.first() // 獲取匹配的第一個元素 .last() // 獲取匹配的最後一個元素 .not() // 從匹配元素的集合中刪除與指定表達式匹配的元素 .has() // 保留包含特定後代的元素，去掉那些不含有指定後代的元素。 .eq() // 索引值等於指定值的元素
左側菜單欄實現：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="x-ua-compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>左側菜單示例</title> <style> .left { position: fixed; left: 0; top: 0; width: 20%; height: 100%; background-color: rgb(47, 53, 61); } .right { width: 80%; height: 100%; } .menu { color: white; } .title { text-align: center; padding: 10px 15px; border-bottom: 1px solid #23282e; } .items { background-color: #181c20; } .item { padding: 5px 10px; border-bottom: 1px solid #23282e; } .hide { display: none; } </style> </head> <body> <div class="left"> <div class="menu"> <div class="item"> <div class="title">菜單一</div> <div class="items"> <div class="item">111</div> <div class="item">222</div> <div class="item">333</div> </div> </div> <div class="item"> <div class="title">菜單二</div> <div class="items hide"> <div class="item">111</div> <div class="item">222</div> <div class="item">333</div> </div> </div> <div class="item"> <div class="title">菜單三</div> <div class="items hide"> <div class="item">111</div> <div class="item">222</div> <div class="item">333</div> </div> </div> </div> </div> <div class="right"></div> <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script> <script> $(".title").click(function (){ // jQuery綁定事件 // 隱藏全部class裏有.items的標籤 // $(".items").addClass("hide"); //批量操做 // $(this).next().removeClass("hide"); // jQuery鏈式操做 $(this).next().removeClass('hide').parent().siblings().find('.items').addClass('hide') }); </script> 左側菜單欄
樣式操做：
樣式類：
addClass();// 添加指定的CSS類名。 removeClass();// 移除指定的CSS類名。 hasClass();// 判斷樣式存不存在 toggleClass();// 切換CSS類名，若是有就移除，若是沒有就添加。
示例：模態框和開關燈
CSS操做：
$("p").css("color", "red"); //將全部p標籤的字體設置爲紅色
位置操做：
offset()// 獲取匹配元素在當前窗口的相對偏移或設置元素位置 position()// 獲取匹配元素相對父元素的偏移 scrollTop()// 獲取匹配元素相對滾動條頂部的偏移 scrollLeft()// 獲取匹配元素相對滾動條左側的偏移
補充：spring
.offset()方法容許咱們檢索一個元素相對於文檔（document）的當前位置。bootstrap
和 .position()的差異在於： .position()是相對於相對於父級元素的位移。瀏覽器
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <meta http-equiv="x-ua-compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>位置相關示例之返回頂部</title> <style> .c1 { width: 100px; height: 200px; background-color: red; } .c2 { height: 50px; width: 50px; position: fixed; bottom: 15px; right: 15px; background-color: #2b669a; } .hide { display: none; } .c3 { height: 100px; } </style> </head> <body> <button id="b1" class="btn btn-default">點我</button> <div class="c1"></div> <div class="c3">1</div> <div class="c3">2</div> <div class="c3">3</div> <div class="c3">4</div> <div class="c3">5</div> <div class="c3">6</div> <div class="c3">7</div> <div class="c3">8</div> <div class="c3">9</div> <div class="c3">10</div> <div class="c3">11</div> <div class="c3">12</div> <div class="c3">13</div> <div class="c3">14</div> <div class="c3">15</div> <div class="c3">16</div> <div class="c3">17</div> <div class="c3">18</div> <div class="c3">19</div> <div class="c3">20</div> <div class="c3">21</div> <div class="c3">22</div> <div class="c3">23</div> <div class="c3">24</div> <div class="c3">25</div> <div class="c3">26</div> <div class="c3">27</div> <div class="c3">28</div> <div class="c3">29</div> <div class="c3">30</div> <div class="c3">31</div> <div class="c3">32</div> <div class="c3">33</div> <div class="c3">34</div> <div class="c3">35</div> <div class="c3">36</div> <div class="c3">37</div> <div class="c3">38</div> <div class="c3">39</div> <div class="c3">40</div> <div class="c3">41</div> <div class="c3">42</div> <div class="c3">43</div> <div class="c3">44</div> <div class="c3">45</div> <div class="c3">46</div> <div class="c3">47</div> <div class="c3">48</div> <div class="c3">49</div> <div class="c3">50</div> <div class="c3">51</div> <div class="c3">52</div> <div class="c3">53</div> <div class="c3">54</div> <div class="c3">55</div> <div class="c3">56</div> <div class="c3">57</div> <div class="c3">58</div> <div class="c3">59</div> <div class="c3">60</div> <div class="c3">61</div> <div class="c3">62</div> <div class="c3">63</div> <div class="c3">64</div> <div class="c3">65</div> <div class="c3">66</div> <div class="c3">67</div> <div class="c3">68</div> <div class="c3">69</div> <div class="c3">70</div> <div class="c3">71</div> <div class="c3">72</div> <div class="c3">73</div> <div class="c3">74</div> <div class="c3">75</div> <div class="c3">76</div> <div class="c3">77</div> <div class="c3">78</div> <div class="c3">79</div> <div class="c3">80</div> <div class="c3">81</div> <div class="c3">82</div> <div class="c3">83</div> <div class="c3">84</div> <div class="c3">85</div> <div class="c3">86</div> <div class="c3">87</div> <div class="c3">88</div> <div class="c3">89</div> <div class="c3">90</div> <div class="c3">91</div> <div class="c3">92</div> <div class="c3">93</div> <div class="c3">94</div> <div class="c3">95</div> <div class="c3">96</div> <div class="c3">97</div> <div class="c3">98</div> <div class="c3">99</div> <div class="c3">100</div> <button id="b2" class="btn btn-default c2 hide">返回頂部</button> <script src="jquery-3.2.1.min.js"></script> <script> $("#b1").on("click", function () { $(".c1").offset({left: 200, top:200}); }); $(window).scroll(function () { if ($(window).scrollTop() > 100) { $("#b2").removeClass("hide"); }else { $("#b2").addClass("hide"); } }); $("#b2").on("click", function () { $(window).scrollTop(0); }) </script> </body> </html> 返回頂部示例
尺寸相關：app
height()：真正的文本高度
width()：真正的文本的寬度
innerHeight()：文本加padding
innerWidth():
outerHeight()：border+padding+文本
outerWidth()
文本操做：
獲取值：
登陸示例：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script> <style> .errors { color: red; } </style> </head> <body> <h3>登錄頁面</h3> <form action=""> <p><label for="d1">username: <input type="text" id="d1"> <span class="errors"></span> </label></p> <p><label for="d2">password: <input type="text" id="d2"> <span class="errors"></span> </label> </p> <input type="submit" id="d3"> </form> <script> var submitEle = document.getElementById('d3'); submitEle.onclick = function () { // 先獲取input框中的內容 var userNameVal = $('#d1').val(); var passWordVal = $('#d2').val(); // 判斷是否爲空 if (userNameVal.length === 0){ // 將username對應的span標籤渲染內容 $('.errors').first().text('用戶名不能爲空'); } if (passWordVal.length === 0){ // 將username對應的span標籤渲染內容 $('.errors').last().text('密碼不能爲空 你個大傻逼'); } // 取消標籤默認的動做 return false }; var inputEle = document.getElementsByTagName('input'); for (let i=0;i<inputEle.length;i++){ inputEle[i].onfocus = function () { $(this).next().text('') } } </script> </body> </html>
屬性操做：
attr(attrName)// 返回第一個匹配元素的屬性值 attr(attrName, attrValue)// 爲全部匹配元素設置一個屬性值 attr({k1: v1, k2:v2})// 爲全部匹配元素設置多個屬性值 removeAttr()// 從每個匹配的元素中刪除一個屬性
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script> </head> <body> <p><input type="checkbox">111 <input type="checkbox" checked id="d1">222 <input type="checkbox">333 </p> <p><input type="radio" checked id="d2">444 <input type="radio">555 <input type="radio">666</p> <select name="" id=""> <option value="" selected id="d3">111</option> <option value="">222</option> <option value="">333</option> </select> </body> </html>
在對checkbox的屬性checked操做時，儘可能使用prop而避免使用.attr。不能在網頁中實時更新選中仍是沒選中。
這已經能夠證實attr的侷限性，它的做用範圍只限於HTML標籤內的屬性，而prop獲取的是這個DOM對象的屬性，選中返回true，沒選中返回false。
文檔處理：
$(A).after(B)// 把B放到A的後面 $(A).insertAfter(B)// 把A放到B的後面
$(A).before(B)// 把B放到A的前面 $(A).insertBefore(B)// 把A放到B的前面
$(A).append(B)// 把B追加到A $(A).appendTo(B)// 把A追加到B
$(A).prepend(B)// 把B前置到A $(A).prependTo(B)// 把A前置到B
remove()// 從DOM中刪除全部匹配的元素。 empty()// 刪除匹配的元素集合中全部的子節點。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script> </head> <body> <div class="c1"> <span id="d1">span</span> <p id="d2">ppp</p> </div> </body> </html>
克隆：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script> <style> button { height: 50px; width: 100px; background-color: orange; } </style> </head> <body> <button>多重影分身之術</button> <script> // var butEle = document.getElementsByTagName('button')[0]; // butEle.onclick = function () { // // $(this).after($(this).clone(true)) // // clone只克隆標籤和文本 不克隆事件 加參數true便可克隆事件 // $(this).clone(true).insertAfter(this); // } $('button').on('click',function () { $(this).clone(true).insertAfter(this); }) </script> </body> </html>
經常使用事件：
click(function(){...})
hover(function(){...})
blur(function(){...})
focus(function(){...})
change(function(){...})
keyup(function(){...})
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script> </head> <body> <span>宜春院</span> <script> $('span').hover( // 鼠標懸浮上去 若是隻寫一個函數 那麼懸浮和移開都會執行 function () { alert('大爺你終於來了!') }, // 鼠標移開 function () { alert('沒錢滾蛋!') } ) </script> </body> </html>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script> </head> <body> <input type="text"> <script> $('input').on('input',function () { console.log($(this).val()) }) </script> </body> </html>
阻止默認事件：
如：提交按鈕點擊事件以後的自動刷新
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script> </head> <body> <form action=""> <input type="submit"> </form> <script> $('input').click(function (e) { alert(123); // 第一種 // return false // 第二種 e.preventDefault() }) </script> </body> </html>
事件冒泡和阻止方式：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script> </head> <body> <div>div <p>p <span>span</span> </p> </div> <script> $('div').click(function (e) { alert('div') }); $('p').click(function (e) { alert('p'); // 第一種取消事件冒泡的方式 // return false e.stopPropagation() }); $('span').click(function (e) { alert('span'); // 第二種取消事件冒泡的方式 // e.stopPropagation() }) </script> </body> </html>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script> </head> <body> <button>屠龍寶刀,點擊就送!</button> <script> // $('button').on('click',function () { // alert(123) // }) // 事件委託 // 將點擊事件委託給body內全部的button按鈕 $('body').on('click','button',function () { alert(123) }) </script> </body> </html>
動畫效果演示：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script> <!--<style>--> <!-- div {--> <!-- height: 1000px;--> <!-- width: 400px;--> <!-- background-color: mediumspringgreen;--> <!-- }--> <!--</style>--> </head> <body> <div>111</div> <div>222</div> <div>333</div> <div>444</div> <div>555</div> <div>666</div> </body> </html>
// 基本 show([s,[e],[fn]])：多少秒以內展現 hide([s,[e],[fn]])：多少秒以內隱藏 toggle([s],[e],[fn]) // 滑動 slideDown([s],[e],[fn]) slideUp([s,[e],[fn]]) slideToggle([s],[e],[fn]) // 淡入淡出 fadeIn([s],[e],[fn]) fadeOut([s],[e],[fn]) fadeTo([[s],o,[e],[fn]]) fadeToggle([s,[e],[fn]]) // 自定義（瞭解便可） animate(p,[s],[e],[fn])
each的用法介紹：
描述：遍歷一個jQuery對象，爲每一個匹配元素執行一個函數。
data：
給元素集合中的每一個元素都存儲一個k，v值。支持全部的標籤，臨時保存數據，不會在文檔流中顯示出來。
JQuery查找練習題：
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <meta http-equiv="x-ua-compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>jQuery選擇器篩選器練習</title> <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"> <link href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"> <style> .my-padding { padding: 10px 0; } .my-dark { background-color: #f5f5f5; } .footer { background: #111; font-size: 0.9em; position: relative; clear: both; } .my-white { color: #ffffff; } body { margin: 0; } #progress { height: 2px; background-color: #b91f1f; transition: opacity 500ms linear; } #progress.done{ opacity: 0; } </style> </head> <body> <div id="progress"></div> <!--導航欄開始--> <nav class="navbar navbar-inverse my-nav"> <div class="container"> <!-- Brand and toggle get grouped for better mobile display --> <div class="navbar-header"> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="http://www.oldboyedu.com/"><strong>OldBoy Edu</strong></a> </div> <!-- Collect the nav links, forms, and other content for toggling --> <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> <ul class="nav navbar-nav"> <li><a href="#">Python學院<span class="sr-only">(current)</span></a></li> <li><a href="#">Linux學院</a></li> <li><a href="http://luffy.oldboyedu.com">路飛學城</a></li> </ul> <ul class="nav navbar-nav navbar-right"> <li><a href="#">好好學習</a></li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">聯繫咱們<span class="caret"></span></a> <ul class="dropdown-menu"> <li><a href="#">Rain</a></li> <li><a href="#">Egon</a></li> <li><a href="#">Yuan</a></li> <li role="separator" class="divider"></li> <li><a href="#">Q1mi</a></li> </ul> </li> </ul> </div><!-- /.navbar-collapse --> </div><!-- /.container-fluid --> </nav> <!--導航欄結束--> <div class="container"> <div class="jumbotron"> <div id="i1" class="container"> <h1 class="c1">元少</h1> <h1 class="c1">帶你學習jQuery</h1> <p id="p1"><a class="btn btn-primary btn-lg" href="https://q1mi.github.io/Blog/2017/07/10/about_jQuery/" role="button">查看更多</a></p></div> </div> <hr> <div class="row"> <div class="col-md-12"> <table class="table table-bordered table-striped"> <thead> <tr> <th>#</th> <th>姓名</th> <th>愛好</th> <th>操做</th> </tr> </thead> <tbody> <tr> <th>1</th> <td>Egon</td> <td>減肥</td> <td> <button class="btn btn-warning">編輯</button> <button class="btn btn-danger">刪除</button> </td> </tr> <tr> <th>2</th> <td>Kevin</td> <td>腰子湯</td> <td> <button class="btn btn-warning">編輯</button> <button class="btn btn-danger">刪除</button> </td> </tr> <tr id="tr3"> <th>3</th> <td>Alex</td> <td>吹牛逼</td> <td> <button class="btn btn-warning">編輯</button> <button class="btn btn-danger">刪除</button> </td> </tr> </tbody> </table> </div> </div> <hr> <div class="row"> <div class="col-md-12"> <form id="f1"> <div class="form-group"> <label for="exampleInputEmail1">郵箱</label> <input type="email" class="form-control" id="exampleInputEmail1" placeholder="Email"> </div> <div class="form-group"> <label for="exampleInputPassword1">密碼</label> <input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password"> </div> <div class="form-group"> <label for="exampleInputFile">上傳頭像</label> <input type="file" id="exampleInputFile"> <p class="help-block">只支持img格式。</p> </div> <button id="btnSubmit" type="submit" class="btn btn-default">提交</button> </form> </div> </div> <hr> <div class="row"> <div class="col-md-12"> <div class="checkbox-wrapper"> <div class="panel panel-info"> <div class="panel-heading">jQuery學習指南</div> <div id="my-checkbox" class="panel-body"> <div class="checkbox"> <label> <input type="checkbox" value="0"> jQuery一點都不難 </label> </div> <div class="checkbox"> <label> <input type="checkbox" value="1" checked> jQuery一學就會 </label> </div> <div class="checkbox"> <label> <input type="checkbox" value="2"> jQuery就要多練 </label> </div> <div class="checkbox"> <label> <input type="checkbox" value="3" disabled> jQuery學很差 </label> </div> </div> </div> </div> <hr> <div class="radio-wrapper"> <div class="panel panel-info"> <div class="panel-heading">我來老男孩以後...</div> <div class="panel-body"> <div class="radio"> <label> <input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" checked> 個人心中只有學習 </label> </div> <div class="radio"> <label> <input type="radio" name="optionsRadios" id="optionsRadios2" value="option2"> 學習真的太TM有意思了 </label> </div> </div> </div> </div> </div> </div> <hr> <div> <i class="fa fa-hand-pointer-o fa-lg fa-rotate-90" aria-hidden="true"></i> <a class="btn btn-success" href="http://jquery.cuishifeng.cn/">jQuery中文API指南</a> </div> <hr> <div class="row"> <div class="col-md-12"> <h2>練習題：</h2> <ol id="o1"> <li>找到本頁面中id是<code>i1</code>的標籤</li> <li>找到本頁面中全部的<code>h2</code>標籤</li> <li>找到本頁面中全部的<code>input</code>標籤</li> <li>找到本頁面全部樣式類中有<code>c1</code>的標籤</li> <li>找到本頁面全部樣式類中有<code>btn-default</code>的標籤</li> <li>找到本頁面全部樣式類中有<code>c1</code>的標籤和全部<code>h2</code>標籤</li> <li>找到本頁面全部樣式類中有<code>c1</code>的標籤和id是<code>p3</code>的標籤</li> <li>找到本頁面全部樣式類中有<code>c1</code>的標籤和全部樣式類中有<code>btn</code>的標籤</li> <p id="p2" class="divider"></p> <li>找到本頁面中<code>form</code>標籤中的全部<code>input</code>標籤</li> <li>找到本頁面中被包裹在<code>label</code>標籤內的<code>input</code>標籤</li> <li>找到本頁面中緊挨在<code>label</code>標籤後面的<code>input</code>標籤</li> <li>找到本頁面中id爲<code>p2</code>的標籤後面全部和它同級的<code>li</code>標籤</li> <p id="p3" class="divider"></p> <li>找到id值爲<code>f1</code>的標籤內部的第一個input標籤</li> <li>找到id值爲<code>my-checkbox</code>的標籤內部最後一個input標籤</li> <li>找到id值爲<code>my-checkbox</code>的標籤內部沒有被選中的那個input標籤</li> <li>找到全部含有<code>input</code>標籤的<code>label</code>標籤</li> </ol> </div> </div> </div> <div class="my-dark my-padding"> <div class="container"> <div class="col-sm-8 my-center"> <p>寫不多的代碼，作不少的事。</p> <h4>因此說</h4> <p>學好jQuery真的很重要，學好jQuery真的很重要，學好jQuery真的很重要。</p> </div> </div> </div> <div class="footer"> <div class="row"> <div class="col-md-12 text-center"> <span class="my-white">©2018 元少</span> </div> </div> </div> <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script> <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> </body> </html>
相關文章
- 1. jQuery 選擇器 篩選器 樣式操做 文本操做 屬性操做 文檔處理 事件 動畫效果 插件 each、data、Ajax
- 2. jQuery經常使用API——包括：jQuery選擇器、樣式操做、效果、屬性操做、內容文本值、元素操做、尺寸及位置操做等
- 3. JQuery 選擇器 文檔處理 操做
- 4. jquery屬性文檔事件等操做
- 5. jQuery二——屬性操做、文檔操做、位置屬性
- 6. jq初始,選擇器,事件,內容操做,樣式操做
- 7. jQuery 文檔操做方法
- 8. jquery選擇器和樣式操做
- 9. JavaScript之jQuery夠用便可（查找篩選器、屬性操做、jQuery文檔處理）
- 10. jQuery文檔操做
- 更多相關文章...
- • ionic 單選框操作 - ionic 教程
- • ionic 選項卡欄操作 - ionic 教程
- • Docker容器實戰(七) - 容器眼光下的文件系統
- • NewSQL-TiDB相關
相關標籤/搜索
每日一句
-
每一个你不满意的现在，都有一个你没有努力的曾经。
歡迎關注本站公眾號,獲取更多信息
相關文章
- 1. jQuery 選擇器 篩選器 樣式操做 文本操做 屬性操做 文檔處理 事件 動畫效果 插件 each、data、Ajax
- 2. jQuery經常使用API——包括：jQuery選擇器、樣式操做、效果、屬性操做、內容文本值、元素操做、尺寸及位置操做等
- 3. JQuery 選擇器 文檔處理 操做
- 4. jquery屬性文檔事件等操做
- 5. jQuery二——屬性操做、文檔操做、位置屬性
- 6. jq初始,選擇器,事件,內容操做,樣式操做
- 7. jQuery 文檔操做方法
- 8. jquery選擇器和樣式操做
- 9. JavaScript之jQuery夠用便可（查找篩選器、屬性操做、jQuery文檔處理）
- 10. jQuery文檔操做