如何使用javascript获取我的css元素的最大宽度

Question

我试图通过max width获取我的CSS元素的using javascript。 我目前能够获得width but not max-width。

hsWidth = $("#horizontal-scroll").width();

由于

Answer 1

使用jQuery方法 .css() ：

var max_width = $("#horizontal-scroll").css('max-width');

希望这有帮助。

＆＃13;

＆＃13;

var max_width = $("#horizontal-scroll").css('max-width');

console.log(max_width);

＆＃13;

#horizontal-scroll{
  max-width: 250px; 
  display: block;
  background-color: green;
  width: 200px;
  height: 50px;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="horizontal-scroll"></div>

＆＃13;

＆＃13;

＆＃13;

Answer 2

您需要使用css('max-width')

以下内容应该为您做到

$('#horizontal-scroll').css('max-width');

您可以找到更多信息here in the jQuery documentation

  

此外，请注意@low_rents的评论，这将是   例如，返回一个带有测量单元的字符串   '100px'或'50％'

Answer 3

请尝试这个有效的例子

//referencing your example..
	var hsWidth = $("#horizontal-scroll").css('max-width');
	console.log(hsWidth);

#horizontal-scroll{
		height:500px;
		width:auto;
		max-width:950px;/*we want to get this...*/
	}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!--target element-->
<div id="horizontal-scroll">
</div>

Answer 4

您只需使用'.css()'方法：

$('#horizontal-scroll').css('maxWidth');

Documentation here