jQuery中height()方法用法實例
更新時間：2014年12月24日 14:26:33 投稿：shichen2014
這篇文章主要介紹了jQuery中height()方法用法,以實例形式較為詳細(xì)分析了height()方法返回元素高度的用法與相關(guān)注意事項,具有一定的參考借鑒價值,需要的朋友可以參考下
本文實例講述了jQuery中height()方法用法。分享給大家供大家參考。具體分析如下：
此方法可以獲取或者設(shè)置匹配元素的高度值，默認(rèn)單位是px。
語法結(jié)構(gòu)一:
復(fù)制代碼 代碼如下:
$(selector).height()
不帶參數(shù)的時候是返回第一個匹配元素的當(dāng)前高度。
實例代碼:
復(fù)制代碼 代碼如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://m.fzitv.net/" />
<title>腳本之家</title>
<style type="text/css">
div{
height:150px;
width:150px;
background-color:green;
margin-top:10px;
}
</style>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
alert($("div").height());
})
</script>
</head>
<body>
<div></div>
</body>
</html>
語法結(jié)構(gòu)二:
復(fù)制代碼 代碼如下:
$(selector).height(val)
帶參數(shù)的時候是設(shè)置所有匹配元素的高度，默認(rèn)單位是px，當(dāng)然也可以使用其他的單位如em或者百分比等等。
實例代碼:
復(fù)制代碼 代碼如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://m.fzitv.net/" />
<title>腳本之家</title>
<style type="text/css">
div{
height:150px;
width:150px;
background-color:green;
margin-top:10px;
}
</style>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("div").height("200px")
})
})
</script>
</head>
<body>
<div></div>
<button>點擊查看效果</button>
</body>
</html>
希望本文所述對大家的jQuery程序設(shè)計有所幫助。
相關(guān)文章
EasyUI的DataGrid每行數(shù)據(jù)添加操作按鈕的實現(xiàn)代碼
今天做項目的時候，想在easyui的datagrid每一列數(shù)據(jù)后邊都加上一個操作按鈕，怎么實現(xiàn)此功能呢？下面小編給大家?guī)砹薊asyUI的DataGrid每行數(shù)據(jù)添加操作按鈕的實現(xiàn)代碼，需要的朋友參考下吧2017-08-08
JQuery報錯Uncaught TypeError: Illegal invocation的處理方法
這篇文章主要介紹了JQuery報錯"Uncaught TypeError: Illegal invocation"的處理方法,需要的朋友可以參考下2015-03-03
jackson解析json字符串,首字母大寫會自動轉(zhuǎn)為小寫的方法
下面小編就為大家分享一篇jackson解析json字符串,首字母大寫會自動轉(zhuǎn)為小寫的方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2017-12-12
這篇文章主要介紹了jQuery 查找元素操作,結(jié)合實例形式總結(jié)分析了jQuery針對頁面元素的各種常見查找操作實現(xiàn)方法,需要的朋友可以參考下2019-10-10
這篇文章主要是對jquery合并內(nèi)容相同的單元格示例代碼進(jìn)行了介紹。需要的朋友可以過來參考下，希望對大家有所幫助2013-12-12
jquery實現(xiàn)的超出屏幕時把固定層變?yōu)槎ㄎ粚拥拇a
相信很多人都上過taobao吧，在taobao的產(chǎn)品列表頁有一個浮動的用來排序的浮動層，當(dāng)你拖動滾動條而導(dǎo)致那個排序欄看不到的時候它會自動變?yōu)楦訉?，一直固定在那里?/div> 2010-02-02
jQuery實現(xiàn)圖片與文字描述左右滑動自動切換的方法
這篇文章主要介紹了jQuery實現(xiàn)圖片與文字描述左右滑動自動切換的方法,涉及jquery實現(xiàn)圖文滑動切換效果的方法,涉及jquery針對頁面元素與樣式的相關(guān)操作技巧,需要的朋友可以參考下2015-07-07
這篇文章主要介紹了小巧強大的jquery layer彈窗彈層插件的使用方法以及使用范圍，非常詳細(xì)，有需要的小伙伴可以參考下。2015-12-12
本文介紹了“JQuery操作tr和td內(nèi)容的方法實例”，需要的朋友可以參考一下2013-03-03
jquery.artwl.thickbox.js 一個非常簡單好用的jQuery彈出層插件
jquery.artwl.thickbox.js 一個非常簡單好用的jQuery彈出層插件，需要的朋友可以參考下2012-03-03最新評論