Query常用DIV操作獲取和設置長度寬度的實現(xiàn)方法
獲取或設置div的高度和寬度
方法一:height和width函數(shù)(得到的是證書),可以用于獲取或設置元素的高度和寬度。
val()獲取或設置元素的值
方法二:css函數(shù)可以用于獲取或設置元素的高度和寬度
獲取css("width")(得到的是以px結尾的字符串),設置css("width",20px)或css({width:20px,height:20px})
JQuery的鏈式操作
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javascript" src="jQuery/jquery-1.12.1.js"></script> <script type="text/javascript"> $(function(){ $("#get").click(function(){ //獲取結果沒有px $("#ht").val($("#div1").height()); $("#wd").val($("#div1").width()); //獲取結果后面有px //$("#ht").val($("#div1").css("height")); //$("#wd").val($("#div1").css("width")); }); $("#make").click(function(){ //$("#div1").css({height:$("#ht").val(),width:$("#wd").val()}); //$("#div1").css("height",$("#ht").val()); //$("#div1").css("width",$("#wd").val()); $("#div1").height($("#ht").val()); $("#div1").width($("#wd").val()); // JQuery的鏈式操作 //$("#div1").css("height",$("#ht").val()).width($("#wd").val()); }); }); </script> <style type="text/css"> #div1 { width:150px; height:150px; background-color:red; border:black 1px solid; } </style> </head> <body> 長度<input type="text" id="ht"/>寬度<input type="text" id="wd"/> <input type="button" value="獲取" id="get"/> <input type="button" value="設置" id="make"/> <div id="div1"></div> </body> </html>
以上就是小編為大家?guī)淼腝uery常用DIV操作獲取和設置長度寬度的實現(xiàn)方法的全部內(nèi)容了,希望對大家有所幫助,多多支持腳本之家~
相關文章
jquery1.5.1中根據(jù)元素ID獲取元素對象的代碼
盡管聽說jquery的大名幾年了,但是一直沒有使用過。這兩天想在項目中使用被一些小細節(jié)折騰的夠嗆,看來jquery沒有傳說中的那么好學。2011-04-04JQuery實現(xiàn)鼠標滾輪滑動到頁面節(jié)點
這篇文章主要介紹了使用JQuery實現(xiàn)鼠標滾輪滑動到頁面節(jié)點的代碼,需要的朋友可以參考下2015-07-07jQuery+jsp下拉框聯(lián)動獲取本地數(shù)據(jù)的方法(附源碼)
這篇文章主要介紹了jQuery+jsp下拉框聯(lián)動獲取本地數(shù)據(jù)的方法,以實例形式較為詳細的分析了jQuery結合jsp實現(xiàn)下拉聯(lián)動菜單讀取本地數(shù)據(jù)的相關技巧,并附帶了完整源碼供讀者下載參考,需要的朋友可以參考下2015-12-12slideToggle+slideup實現(xiàn)手機端折疊菜單效果
這篇文章主要為大家詳細介紹了slideToggle+slideup實現(xiàn)手機端折疊菜單效果,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-05-05關于echarts在節(jié)點顯示動態(tài)數(shù)據(jù)及添加提示文本所遇到的問題
這篇文章主要介紹了關于echarts在節(jié)點顯示動態(tài)數(shù)據(jù)及添加提示文本所遇到的問題,需要的朋友可以參考下2018-04-04