简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Home > Web Front-end > JS Tutorial > body text

How to modify the display attribute in jquery

青灯夜游
Release： 2023-01-04 09:59:23
Original
11836 people have browsed it

In jquery, you can use the css() method to modify the display attribute, the syntax "$(selector).css("display","attribute value")" or "$(selector).css({ "display":"Attribute value"})".

How to modify the display attribute in jquery

The operating environment of this tutorial: windows7 system, jquery3.6 version, Dell G3 computer.

In jquery, you can use the css() method to modify the display attribute. The css() method sets one or more style properties of the selected element.

Syntax: 

$(selector).css("propertyname","value");
$(selector).css({"propertyname":"value"});
Copy after login

Example: Set the display attribute of the div element to none to hide the div element. 

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="js/jquery-3.6.0.min.js"></script>
</script>
<script>
$(document).ready(function(){
	$("button").click(function(){
		$("div").css({"display":"none"});
	});
});
</script>
</head>
<body>

<div style="border: 1px solid red;">hello</div>
<br>
<button>点击按钮，修改display属性</button>

</body>
</html>
Copy after login

How to modify the display attribute in jquery

Recommended related video tutorials: jQuery Tutorial (Video)

The above is the detailed content of How to modify the display attribute in jquery. For more information, please follow other related articles on the PHP Chinese website!

Related labels：
jquery display attribute
source：php.cn
Previous article：How to convert jquery object to js object Next article：How to modify the style attribute in jquery
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Latest Issues
Steps to install jQuery in Nuxt.js Although I try to add jQuery in my project, I get an error saying it's not defined. plugin...
From 2023-11-06 16:41:50
0
1
225
jQuery getting wrong value when getting data attribute I have a div with data attribute <divclass='p1'data-location='1'></div> I have...
From 2023-11-01 23:01:19
0
1
209
Support jQuery's Transfer-Encoding:chunked I'm a web developer. In my script I use header() to set "Transfer-Encoding:chunked&qu...
From 2023-10-25 23:44:37
0
1
230
How to get the natural dimensions of an image using JavaScript or jQuery? So far I have this code: varimg=document.getElementById('draggable'); varwidth=img.clientW...
From 2023-10-21 13:53:08
0
2
275
Automatically expand text area I'm trying to make a simple auto-expanding text area. This is my code: textarea.onkeyup=fu...
From 2023-10-21 08:49:23
0
2
225
Related Topics
More>
Popular Recommendations
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn：Public welfare online PHP training，Help PHP learners grow quickly！