Question

这里我要问两个问题......

如何获得div的确切宽度

代码：

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    alert("Width of div: " + $("#a").width());
  });
});
</script>
</head>
<body>
<div id="a" style="width:1000px;height:500px;">
<div style="height:100px;width:300px;padding:10px;margin:3px;border:1px solid blue;background-color:lightblue;">
</div>
</div>
<br>
<button>Display the width of div</button>

</body>
</html>

这里我宣布2 ..父div宽度是1000子div宽度是300如果我使用$（＆＃34; #a＆＃34;）。width（）函数我将得到1000我在那个div上提到。但是如何使用$（＆＃34;＃a＆＃34;）获得精确使用的宽度（300）以及高度相同？

Answer 1

你的＆＃34; a＆＃34;是1000px - 因为你想要＆＃34; a＆＃34;中的div的宽度。你需要使用：

$("#a div").width()

或者你可以有多个div - 然后使用：first（或其他一些选择器）

Answer 2

您可以使用{/ 1}}方法，例如

attr

Answer 3

尝试使用jquery中的链接

$("#a div").width()

Answer 4

使用可以使用此代码获取#a div

中的高度和宽度div

＆＃13;

$(document).ready(function(){
  $("button").click(function(){
    alert("Width of div: " + $("#a div").width());
    alert("Width of div: " + $("#a div").height());
  });
});

＆＃13;

Answer 5

如果你只有两个div，那你为什么不给你的第二个div分配id。

<div id="a" style="width:1000px;height:500px;">
<div id="b" style="height:100px;width:300px;padding:10px;margin:3px;border:1px solid blue;background-  color:lightblue;">
</div>
</div>

然后你可以按如下方式获得宽度和高度：

var width = $('#b').attr("width");
var height = $('#b').attr("height");

如何获得div的精确宽度和高度

5 个答案: