氣泡排序（Bubble Sorting）
阿新 • • 發佈：2021-07-17
操作元素(屬性)
屬性操作
''' --------------------------屬性 $("").attr(); $("").removeAttr(); $("").prop(); $("").removeProp(); --------------------------CSS類 $("").addClass(class|fn) $("").removeClass([class|fn]) --------------------------HTML程式碼/文字/值 $("").html([val|fn]) $("").text([val|fn]) $("").val([val|fn|arr]) --------------------------- $("").css("color","red")'''
注意：
<input id="chk1" type="checkbox" />是否可見 <input id="chk2" type="checkbox" checked="checked" />是否可見 <script> //對於HTML元素本身就帶有的固有屬性，在處理時，使用prop方法。 //對於HTML元素我們自己自定義的DOM屬性，在處理時，使用attr方法。 //像checkbox，radio和select這樣的元素，選中屬性對應“checked”和“selected”，這些也屬於固有屬性，因此 //需要使用prop方法去操作才能獲得正確的結果。 //$("#chk1").attr("checked") // undefined // $("#chk1").prop("checked") // false // ---------手動選中的時候attr()獲得到沒有意義的undefined----------- // $("#chk1").attr("checked") // undefined // $("#chk1").prop("checked") // true console.log($("#chk1").prop("checked"));//false console.log($("#chk2").prop("checked"));//true console.log($("#chk1").attr("checked"));//undefined console.log($("#chk2").attr("checked"));//checked </script> attr和prop
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> .hide{ display: none; } </style> </head> <body> <div class="div1"></div> <script src="jquery-3.3.1.js"></script> <script> console.log($('.div1').hasClass('div1')) // true；$('P').hasClass('p1')判斷P標籤是否有class屬性值為p1，返回布林值 </script> <!--***********************屬性操作***********************--> <div class="div2" con="c1"></div> <input type="checkbox">是否可見 <input type="checkbox" checked="checked">是否可見 <script> console.log($('.div2').attr('con')); // c1 $('.div2').attr('con','c2'); // 可以發現con屬性值已經更改為c2 console.log($(':checkbox:first').attr('checked')); // undefined console.log($(':checkbox:last').attr('checked')); // checked console.log($(':checkbox:first').prop('checked')); // false console.log($(':checkbox:last').prop('checked')); // true console.log($('.div2').prop('con')); // undefined $('.div2').prop('con','c3'); // 上面已經顯示了找不到，所以無法更改 // 結論：prop與attr用法相似，但是對於標籤固有屬性使用prop好一些，對於標籤自定義屬性使用attr好一些 </script> <div class="div3 hide">hello div</div> <script> $('.div3').removeClass('hide'); // 移除屬性值 $('.div3').addClass('hide'); // 新增屬性值 </script> <div id="id1"> aaaaaa <p>pppppp</p> </div> <script> console.log($('#id1').html()); // aaaaaa <p>pppppp</p> console.log($('#id1').text()); // aaaaaa pppppp $('#id1').html('<h1>hello</h1>'); // 把h1標籤渲染了 $('#id1').text('<h1>hello</h1>'); // 直接把h1標籤當作文字內容 </script> <input type="text" value="123"> <div value="456"></div> <script> console.log($(':text').val()); // 123 console.log($(':text').next().val()); // 什麼都沒列印 $(':text').val('789'); // 結論：val只能對有固有屬性value的標籤進行取值，如input/select/option </script> <div class="div4">hi</div> <script> $('.div4').css('color','red'); // $('.div4').css({'color':'yellow','background-color':'black'}); // 這種寫法也可以 </script> </body> </html>while True: print('studying...')