溫馨提示×

溫馨提示×

您好，登錄后才能下訂單哦！

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

jQuery中幾個關于元素寬高方法的區(qū)別

發(fā)布時間：2020-07-26 19:54:36 來源：網(wǎng)絡 閱讀：256 作者：mirindaRain 欄目：web開發(fā)

幾個關于元素寬高的方法

  • height():帶參數(shù)設置，不帶參數(shù)獲取,參數(shù)是number類型
  • width():帶參數(shù)設置，不帶參數(shù)獲取,參數(shù)是number類型
  • innerHeight() :內(nèi)邊距+內(nèi)容的高度
  • innerWidth() :內(nèi)邊距+內(nèi)容的寬度
  • outerHeight：上下內(nèi)邊距+內(nèi)容+上下邊框
  • outerWidth :左右內(nèi)邊距+內(nèi)容+左右邊框

案例測試：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>元素寬度與高度</title>
    <style type="text/css">
        #container{
            width:200px;
            height:200px;
            padding:20px;
            margin:30px;
            border:5px solid red;
        }
    </style>
    <script type="text/javascript" src="jquery-1.11.1.js"></script>
    <script type="text/javascript">
        $(function(){
            console.log("width():"+$("#container").width());
            console.log("height():"+$("#container").height());
            console.log("innerWidth()"+$("#container").innerWidth());
            console.log("innerHeight():"+$("#container").innerHeight());
            console.log("outerWidth():"+$("#container").outerWidth());
            console.log("outerHeight():"+$("#container").outerHeight());
        })
    </script>
</head>
<body>
    <div id = "container"></div>
</body>
</html>

運行結果：

jQuery中幾個關于元素寬高方法的區(qū)別

向AI問一下細節(jié)

免責聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉載和分享為主，文章觀點不代表本網(wǎng)站立場，如果涉及侵權請聯(lián)系站長郵箱：is@yisu.com進行舉報，并提供相關證據(jù)，一經(jīng)查實，將立刻刪除涉嫌侵權內(nèi)容。

AI
助
手