Query常用DIV操作獲取和設(shè)置長度寬度的實現(xiàn)方法
更新時間：2016年09月19日 08:05:58 投稿：jingxian
下面小編就為大家?guī)硪黄猀uery常用DIV操作獲取和設(shè)置長度寬度的實現(xiàn)方法。小編覺得挺不錯的，現(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è)置長度寬度的實現(xiàn)方法的全部內(nèi)容了，希望對大家有所幫助，多多支持腳本之家~
相關(guān)文章
我們看到很多網(wǎng)站會有有錯誤404頁面，當(dāng)頁面不存存時就會提示，然后過幾秒就會自動跳到首頁了，下面我來給大家舉一個404錯誤頁面跳到首頁實例，有需要的朋友可以參考一下2013-08-08
javascript截圖 jQuery插件imgAreaSelect使用詳解
這篇文章主要介紹了avascript截圖 jQuery插件imgAreaSelect使用詳解,需要的朋友可以參考下2016-05-05
jQuery的數(shù)組處理,便捷,功能齊全. 最近的項目中用到的比較多，最近時間緊迫,今天抽了些時間回過頭來看 jQuery中文文檔順便對jQuery數(shù)組做個總結(jié)2013-11-11
這篇文章主要給大家分享了一段基于jquery實現(xiàn)等比縮放圖片的代碼，非常的實用，這里推薦給大家2014-12-12
jQuery使用zTree插件實現(xiàn)可拖拽的樹示例
本篇文章主要介紹了js使用zTree插件實現(xiàn)可拖拽的樹示例，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-09-09
分享精心挑選的12款優(yōu)秀jQuery Ajax分頁插件和教程
在這篇文章中，我為大家收集了12個基于 jQuery 框架的 Ajax 分頁插件，這些插件都提供了詳細的使用教程和演示2012-08-08
瀏覽器端跨域訪問一直是個問題, 多數(shù)研發(fā)人員對待js的態(tài)度都是好了傷疤忘了疼,所以病發(fā)的時候,時不時地都要疼上一疼.記得很久以前使用iframe 加script domain 聲明,yahoo js util 的方式解決二級域名跨域訪問的問題.2009-12-12
jQuery總體架構(gòu)的理解,學(xué)習(xí)jquery的朋友可以參考下。2011-03-03
通過過濾器可以獲取特定的表單元素，如非輸入項目或者單選按鈕的已選項目等元素，可用的2011-07-07
ASP.NET jQuery 實例10 動態(tài)修改hyperlink的URL值
這節(jié)我們來看下如何實現(xiàn)通過選擇RadioButtonList值動態(tài)改變hyperlink控件的URL值，并簡要介紹bind和live方法的區(qū)別2012-02-02