????:<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>jQuery操作屬性val</title> &n
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>jQuery操作屬性val</title> <script type="text/javascript" src="jquery-3.3.1.min.js"></script> <style type="text/css"> button{margin: 4px;cursor: pointer;} input{margin: 4px;color: blue;} </style> <script> $(function () { $("button").click(function () { var text = $(this).text(); $("input").val(text); }); }) </script> </head> <body> <div> <button>蘋果</button> <button>橘子</button> <button>香蕉</button> </div> <input type="text" value="喜歡吃什么?"> </body> </html>
val()用于獲取被選中元素的值;和attr()的區(qū)別是attr()返回的是屬性值,例如可以使用attr()修改元素的寬,高屬性等。
addClass()和removeClass()前者是添加一個(gè)或多個(gè)類名:$('div').addClass("box1 box2");//添加一個(gè)或多個(gè)類名;后者是刪除一個(gè)或多個(gè)以及全部類名:$('div').removeClass();//刪除全部類名
toggleClass()可以動(dòng)態(tài)的切換(添加/刪除)元素的類;
removeAttr()和前面的attr()相關(guān),用于移除元素的屬性值;
hasClass()用于檢查是否包含指定的類;
text()和html()類似都是設(shè)置該元素的所有內(nèi)容并替換掉原來(lái)的內(nèi)容,但是html()比text()適用更多,比如同樣:
$('p').html('<a href="https://www.baidu.com">百度一下</a>');
$('p').text('<a href="https://www.baidu.com">百度一下</a>');
html()結(jié)果是百度一下的超鏈接,而text()結(jié)果<a href="https://www.baidu.com">百度一下</a>;