怎么使用jquery改变div高度

青灯夜游
Freigeben: 2022-06-08 16:27:13
Original
4085 人浏览过

3种方法:1、用“$("div").height(高度值)”,设置新的高度值;2、用“$("div").css("height","高度值")”,添加新高度样式;3、用“$("div").attr("style","height:值")”。

怎么使用jquery改变div高度

本教程操作环境:windows7系统、jquery3.2.1版本、Dell G3电脑。

jquery中有多种方法可以修改元素的高度:

  • height()

  • css()

  • attr()

1、使用height()修改div高度

height() 方法可以设置匹配元素的高度。语法:

$("div").height(高度值)
Nach dem Login kopieren

示例:



	
		
		
		
		
	
一个div元素,高度60px

Nach dem Login kopieren

1.gif

2、使用css()修改div高度

使用css()给td元素添加height样式,语法:

$("div").css("height","高度值");
Nach dem Login kopieren

示例:在方法1示例的基础上修改

$(document).ready(function() {
	$("button").click(function() {
		$("div").css("height","40px");
	});
});
Nach dem Login kopieren

2.gif

3、使用attr()修改div高度

利用attr()控制style属性值,给td元素添加height样式。语法:

$("div").attr("style","height:高度值")
Nach dem Login kopieren

示例:在方法1示例的基础上修改

$(document).ready(function() {
	$("button").click(function() {
		$("div").attr("style","height:100px")
	});
});
Nach dem Login kopieren

3.gif

【推荐学习:jQuery视频教程web前端视频

以上是怎么使用jquery改变div高度的详细内容。更多信息请关注PHP中文网其他相关文章!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!