How to hide more than one part in jquery-Front-end Q&A-php.cn

How to hide more than one part in jquery

青灯夜游

Release： 2022-06-10 14:57:47

Original

1895 people have browsed it

In jquery, you can add an overflow style to an element through the css() method to hide the excess part. The syntax is "$("specified element").css("overflow","hidden");" . The css() method can set one or more style attributes for the specified element; the overflow attribute is used to set the processing method when the content overflows the element box. When the attribute value is set to "hidden", the excess part (overflow content) can be trimmed. , and hide it.

How to hide more than one part in jquery

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

In jquery, you can add an overflow style to an element through the css() method to hide the excess part.

css() method can set one or more style attributes of the matched element. When using this method to set the overflow: hidden; style to an element, the excess part can be hidden.

Syntax format:

$("指定元素").css("overflow","hidden");

Copy after login

The overflow attribute can control the addition of scroll bars in the corresponding element range when the content overflows the element box, which is used to set the processing method when the content overflows the element box.

When the value of this attribute is set to "hidden", the excess part (overflow content) can be trimmed and hidden.

Implementation code:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<script src="./js/jquery-3.6.0.min.js"></script>
		<script>
			$(document).ready(function() {
				$("button").click(function() {
					$("div").css("overflow","hidden");
				});
			});
		</script>
		<style>
			div {
				background-color: #eee;
				width: 200px;
				height: 100px;
				border: 1px dotted black;
				overflow: visible;
			}
		</style>
	</head>
	<body>

		<div>
			<p>这里的文本内容会溢出元素框。</p>
			<p>这里的文本内容会溢出元素框。</p>
			<p>这里的文本内容会溢出元素框。</p>
		</div>
		<br><br><br><br><br>
		<button>隐藏多个td元素</button>
	</body>
</html>

Copy after login

How to hide more than one part in jquery

[Recommended learning: jQuery video tutorial, web Front-End Video】

The above is the detailed content of How to hide more than one part in jquery. For more information, please follow other related articles on the PHP Chinese website!