手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >jQuery中outerWidth()方法用法实例
jQuery中outerWidth()方法用法实例
摘要:本文实例讲述了jQuery中outerWidth()方法用法。分享给大家供大家参考。具体分析如下:此方法获取第一个匹配元素外部宽度。默认情况...

本文实例讲述了jQuery中outerWidth()方法用法。分享给大家供大家参考。具体分析如下:

此方法获取第一个匹配元素外部宽度。

默认情况下外部高度是宽度(width)、内补白(padding)和边框(border)之和。

如果参数设置为true的话,外补白(margin)尺寸也会算入外部宽度。

此方法对可见和隐藏元素均有效。

可以与outerHeight()方法结合学习。

语法结构:

复制代码 代码如下:$(selector).outerWidth(options)

参数列表:

参数 描述
options 定义是否把外补白(margin)计算在内:

一.fase,外补白不计算在内,默认值。

二.true,外补白计算在内。

实例代码:

复制代码 代码如下:

<!DOCTYPE html>

<html>

<head>

<meta charset=" utf-8">

<meta name="author" content="http://www.jb51.net/" />

<title>outerWidth()函数-查字典教程网</title>

<style type="text/css">

div{

background-color:green;

height:100px;

width:200px;

padding:10px;

margin:10px;

border:5px solid red;

}

</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").text($("div").outerWidth(true))

})

})

</script>

</head>

<body>

<div>此处显outerWidth()数值</div>

<button>点击查看div的outerWidth</button>

</body>

</html>

点击按钮可以显示div的元素外部宽度。

希望本文所述对大家的jQuery程序设计有所帮助。

本文转自:蚂蚁部落http://www.softwhy.com/

【jQuery中outerWidth()方法用法实例】相关文章:

JavaScript中search()方法的使用

JQuery中节点遍历方法实例

JavaScript中strike()方法的使用介绍

JavaScript中的substr()方法使用详解

JavaScript中的toUTCString()方法使用详解

JavaScript中继承用法实例分析

详解JavaScript中Date.UTC()方法的使用

Jquery中基本选择器用法实例详解

javaScript中slice函数用法实例分析

简介JavaScript中toTimeString()方法的使用

精品推荐
分类导航