Query常用DIV操作獲取和設(shè)置長度寬度的實(shí)現(xiàn)方法
獲取或設(shè)置div的高度和寬度
方法一:height和width函數(shù)(得到的是證書),可以用于獲取或設(shè)置元素的高度和寬度。
val()獲取或設(shè)置元素的值
方法二:css函數(shù)可以用于獲取或設(shè)置元素的高度和寬度
獲取css("width")(得到的是以px結(jié)尾的字符串),設(shè)置css("width",20px)或css({width:20px,height:20px})
JQuery的鏈?zhǔn)讲僮?/strong>
<!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(){
//獲取結(jié)果沒有px
$("#ht").val($("#div1").height());
$("#wd").val($("#div1").width());
//獲取結(jié)果后面有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的鏈?zhǔn)讲僮?
//$("#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="設(shè)置" id="make"/>
<div id="div1"></div>
</body>
</html>



以上就是小編為大家?guī)淼腝uery常用DIV操作獲取和設(shè)置長度寬度的實(shí)現(xiàn)方法的全部內(nèi)容了,希望對大家有所幫助,多多支持腳本之家~
相關(guān)文章
Jquery實(shí)現(xiàn)簡單的輪播效果(代碼管用)
這篇文章主要介紹了Jquery實(shí)現(xiàn)簡單的輪播效果(代碼管用) 的相關(guān)資料,需要的朋友可以參考下2016-03-03
jquery1.5.1中根據(jù)元素ID獲取元素對象的代碼
盡管聽說jquery的大名幾年了,但是一直沒有使用過。這兩天想在項(xiàng)目中使用被一些小細(xì)節(jié)折騰的夠嗆,看來jquery沒有傳說中的那么好學(xué)。2011-04-04
JQuery實(shí)現(xiàn)鼠標(biāo)滾輪滑動到頁面節(jié)點(diǎn)
這篇文章主要介紹了使用JQuery實(shí)現(xiàn)鼠標(biāo)滾輪滑動到頁面節(jié)點(diǎn)的代碼,需要的朋友可以參考下2015-07-07
jQuery+jsp下拉框聯(lián)動獲取本地?cái)?shù)據(jù)的方法(附源碼)
這篇文章主要介紹了jQuery+jsp下拉框聯(lián)動獲取本地?cái)?shù)據(jù)的方法,以實(shí)例形式較為詳細(xì)的分析了jQuery結(jié)合jsp實(shí)現(xiàn)下拉聯(lián)動菜單讀取本地?cái)?shù)據(jù)的相關(guān)技巧,并附帶了完整源碼供讀者下載參考,需要的朋友可以參考下2015-12-12
slideToggle+slideup實(shí)現(xiàn)手機(jī)端折疊菜單效果
這篇文章主要為大家詳細(xì)介紹了slideToggle+slideup實(shí)現(xiàn)手機(jī)端折疊菜單效果,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-05-05
關(guān)于echarts在節(jié)點(diǎn)顯示動態(tài)數(shù)據(jù)及添加提示文本所遇到的問題
這篇文章主要介紹了關(guān)于echarts在節(jié)點(diǎn)顯示動態(tài)數(shù)據(jù)及添加提示文本所遇到的問題,需要的朋友可以參考下2018-04-04

