问答文章1 问答文章501 问答文章1001 问答文章1501 问答文章2001 问答文章2501 问答文章3001 问答文章3501 问答文章4001 问答文章4501 问答文章5001 问答文章5501 问答文章6001 问答文章6501 问答文章7001 问答文章7501 问答文章8001 问答文章8501 问答文章9001 问答文章9501
你好,欢迎来到懂视!登录注册
当前位置: 首页 - 正文

javascript如何获取div的class中设置的宽高度?

发布网友 发布时间:2022-04-22 20:19

我来回答

3个回答

热心网友 时间:2022-04-20 11:19

javascript获取div的class中设置的宽高度:

高度(offsetHeight):

<head><title>用js获取div的高度</title></head>
<style  type="text/css">
#box{border:1px solid #ff0000;width:200px; }
</style>
<script language="javascript">
function jj(){
var pp=document.getElementById("box").offsetHeight;
alert(pp);
}
</script>
<body>
<div id="box">
<p>段落内容.....</p><p>段落内容.....</p>
<input type="button" onclick="jj();" value="click">
</div>
</body>

宽度(offsetWidth):

<head><title>用js获取div的高度</title></head>
<style  type="text/css">
#box{border:1px solid #ff0000;width:200px; }
</style>
<script language="javascript">
function jj(){
var pp=document.getElementById("box").offsetWidth;
alert(pp);
}
</script>
<body>
<div id="box">
<p>段落内容.....</p><p>段落内容.....</p>
<input type="button" onclick="jj();" value="click">
</div>
</body>

热心网友 时间:2022-04-20 12:37

使用原生方法

document.getElementById("d1").style.width;

这种只能获取到行内内联样式,也就是

<div id="d1" class="d1" style="width:100px" onClick="dd()">qooo</div>

那么document.getElementById("d1").style.width的值就是100px,如果没有设置内联样式,那值肯定是空的,但jQuery框架的width方法提供了另一种实现,是可以直接获取到宽度的,不管是否是行内内联定义的宽度


你可以试试以下代码,就明白了:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="

<style type="text/css">
.d1{
width:100px;
height:100px;}
</style>
<script type="text/javascript">
function dd(){
var nativeWidth = document.getElementById("d1").style.width;
alert(nativeWidth);//为空
var jQueryWidth = $("#d1").width();
alert(jQueryWidth);//100
}
</script>
</head>
<body>
<div id="d1" class="d1" onClick="dd()">qooo</div>
</body>
</html>

热心网友 时间:2022-04-20 14:11

你js获取的是ID=d1的宽度(document.getElementById("d1").style.width),

但是你的样式里面是设置class=d1的样式,
肯定返回的是空吖 你都没有获取class的样式呢,只是获取了id样式
javascript如何获取div的class中设置的宽高度?

&lt;div id="d1" class="div1"&gt;div1&lt;/div&gt; var d = document.getElementId("d1");var w = d.style["width"] || d.width;var h = d.style["height"] || d.height;我就没有听说过用那个就获取不到宽和高了

JavaScript如何获取div的尺寸

var div1width = document.getElementById("div1").offsetWidth; //宽 var div1height = document.getElementById("div1").offsetHeight; //高

请问如何用javascript获取元素的宽或高,例如:&lt;div id="d1"&gt;asdasd&lt;/...

document.getElementById("d1").offsetWidth //宽 document.getElementById("d1").offsetHeight //高

怎么用js获取div的当前宽度?

第一种情况就是宽高都写在样式表里,就比如#div1{width:120px;}。这中情况通过#div1.style.width拿不到宽度,而通过#div1.offsetWidth才可以获取到宽度。第二种情况就是宽和高是写在行内中,比如style="width:120px;",这中情况通过上述2个方法都能拿到宽度。(什么是行内,就是直接在html标签...

javascript动态获得div的高度并输出的问题,谢谢!

对,如果用原生的js:document.getElementById("div1").style.height获取高度的话只能获取内嵌(行内)样式,也就是写在元素上面的样式,意思你用:document.getElementById("div1").style.height=“50px”;或者在元素上:&lt;div style="height:50px"&gt;&lt;/div&gt;设置了之后就可以用了,但是没有设置之前...

JavaScript 如何获取和修改 div 中style中的值

&lt;body&gt;&lt;div style="height: 20px;width: 20px;background: #666;" id="node"&gt;&lt;/div&gt;&lt;script&gt; // 使用原生JS var node = document.getElementById("node"); node.style.background = "black"; // 使用JQuery var node = $("#node"); node.css("background", "...

javascript 如何在firefox中获取div的高度?

获取该元素,使用offsetHeight取得高度 document.getElementById('sample').offsetHeight

请问一下:css中将div的height设置为auto,在js中怎么取出这个height的实 ...

&lt;!--.div就是找到class="div"的信息,用height()方法就可以得到对象的高度的,div信息加载完成,自然就会自己的高度,这时候读取就可以了(深圳网站建设www.sz886.com)--&gt; &lt;script type="text/javascript" src="http://www.sz886.com/js/jquery-1.9.1.min.js"&gt;&lt;/script&gt; &lt;script type="...

javascript怎么获取div id或者class

无论你想取得DIV的ID还是CLASS 最重要的是找到你想取值的DIV对象.要取得DIV对象的方法有很多.常用的有2个,一个是根据ID,用 var div=document.getElementById('youdivid')另一种就是通过标签名来取得 var div=document.getElementsByTagName('div')[num]第2种方法和第一种方法的区别是不用设ID...

js如何获取DIV的 class值?

1.根据ID,用var div=document.getElementById('youdivid')2.通过标签名来取得var div=document.getElementsByTagName('div')[num]3.举个例子:function a(){var div=document.getElementById('a');alert('div的class为:'+div.id)alert('div的id为:'+div.className)} function b(){var div...

声明:本网页内容为用户发布,旨在传播知识,不代表本网认同其观点,若有侵权等问题请及时与本网联系,我们将在第一时间删除处理。
E-MAIL:11247931@qq.com
作文,只要肯学,还来得及 跆拳道黄绿带考神马 智勇跆拳道馆生黄绿带考级内容是什么? 跆拳道如何轻松考黄绿带?考试需要缴费吗? 随处可见的白衬衫太千篇一律,如何穿出白衬衫的小谐趣? 地铁小白楼站和徐州道站可以换乘吗? 小白楼小白楼的商业 天津如家快捷酒店(小白楼店)介绍 简写游戏名字,急!!! 名字是:天命所归々舍我其谁 会计师要有什么条件 如何用JavaScript修改指定ID里面指定的classDIV内容? 如何用javascript为元素添加class? js如何获取DIV的 class值? 如何用JS给循环出来的第一个div添加一个class参数 js 给当前的div添加class属性,设置值为&quot;yourdiv&quot;, js怎么给指定id下面的所有子div添加class? js怎么动态控制div的class? 用js给一个div中添加一个带有class的div ? 菠萝在风水中有什么用 菠萝理财是骗子吗 台湾菠萝收购价格几乎崩盘,这是否意味着市场上菠萝价格下降? 零醛添加定制品牌有哪些?有可信度高的品牌吗? 台湾菠萝收购价接近崩盘,你怎么看? 菠萝涨价近三倍创下了历史新高,这是怎么回事? 为积极推进广东徐闻菠萝走入市场,“徐闻菠萝”做出了哪些举动? &quot;徐闻菠萝事件&quot;究竟亏在哪 菠萝价涨近3倍创历史新高,菠萝的销售为什么会受到疫情的影响? “菠萝战争”里的中介,为何会有人赚有人巨赔? 后盖是素皮的华为mate30Pro5G是2020年9月1号上市的吗? 煮熟的鸡肉在冰箱里能放几天? 怎么用Js添加div? javascript怎么获取div id或者class 用JS怎么写一个点击按钮就可以改变指定div的ID或者class名呢 求JS判断时间写入div class代码 javascript中调用div class中图片链接的onclick事件 尖锐湿疣的治疗费用商业保险可以报销吗? 如何用JS修改class(这个div只有class没有id,我自己也无法添加id),如修 ... 尖锐湿疣可入保险吗 javascript 在div添加内容 平安保险能报尖锐湿疣吗? js中修改div的class会引起重排吗? 尖锐湿疣保险会报销吗 得了尖锐湿疣后治病,医保到底能不能报? javascript进行判断div是否有某class,然后对指定id执行某段语句_百度... 商保可以报销尖锐湿疣吗 得尖锐湿疣还可以买保险吗 得了尖锐湿疣可以买保险么 尖锐湿疣医保可报销吗? 尖锐湿疣住院治疗保险给报消吗 我得了尖锐湿疣,已参加了商业医疗保险,能报销吗
  • 焦点

最新推荐

猜你喜欢

热门推荐