如何使用JQuery隐藏和显示HTML元素?

时间:2022-03-02 14:29:44

How to I hide and show HTML elements using JQuery without any special effects?

如何在没有任何特效的情况下使用JQuery隐藏和显示HTML元素?

6 个解决方案

#1


Using the hide() and show() methods:

使用hide()和show()方法:

$("selector").hide();
$("selector").show();

Where "selector" is whatever is appropriate. Like:

“选择器”是适当的。喜欢:

<script type="text/javascript">
$(function() {
  $("#mybutton").click(function() {
    $("#mydiv").toggle();
  });
});
</script>
<div id="mydiv">
This is some text
</div>
<input type="button" id="mybutton" value="Toggle Div">

The toggle() method just calls show() if hidden or hide() if its not.

如果隐藏,则toggle()方法只调用show(),否则调用hide()。

#2


$('#someElement').show(); //an element with id of someElement

$('.someElement').hide();  //hide elements with class of someElement

$('a').hide(); //hide all anchor elements on the page

See:

http://docs.jquery.com/Effects/show

and

http://docs.jquery.com/Effects/hide

Also, would be a good idea to read up on Selectors:

另外,阅读选择器是个好主意:

http://docs.jquery.com/Selectors

#3


Toggling display:

$('selector').toggle();

Show:

$('selector').show();

Hide:

$('selector').hide();

#4


$("selector").toggle() switches the selected DOM element(s) between hidden and shown. $("selector").hide() hides the selected DOM element(s). $("selector").show() shows the selected DOM element(s).

$(“selector”)。toggle()在隐藏和显示之间切换选定的DOM元素。 $(“selector”)。hide()隐藏选定的DOM元素。 $(“selector”)。show()显示选定的DOM元素。

Truthfully though, I think you could've solved this problem without having to consult *. The jquery docs are pretty clear imo!

说实话,我认为你可以解决这个问题,而无需咨询*。 jquery文档非常清楚imo!

see the jQuery online documentation for show, hide and toggle.

查看show,hide和toggle的jQuery在线文档。

#5


Hide element:

$('#myElement').hide();

Show element:

$('#myElement').show();

#1


Using the hide() and show() methods:

使用hide()和show()方法:

$("selector").hide();
$("selector").show();

Where "selector" is whatever is appropriate. Like:

“选择器”是适当的。喜欢:

<script type="text/javascript">
$(function() {
  $("#mybutton").click(function() {
    $("#mydiv").toggle();
  });
});
</script>
<div id="mydiv">
This is some text
</div>
<input type="button" id="mybutton" value="Toggle Div">

The toggle() method just calls show() if hidden or hide() if its not.

如果隐藏,则toggle()方法只调用show(),否则调用hide()。

#2


$('#someElement').show(); //an element with id of someElement

$('.someElement').hide();  //hide elements with class of someElement

$('a').hide(); //hide all anchor elements on the page

See:

http://docs.jquery.com/Effects/show

and

http://docs.jquery.com/Effects/hide

Also, would be a good idea to read up on Selectors:

另外,阅读选择器是个好主意:

http://docs.jquery.com/Selectors

#3


Toggling display:

$('selector').toggle();

Show:

$('selector').show();

Hide:

$('selector').hide();

#4


$("selector").toggle() switches the selected DOM element(s) between hidden and shown. $("selector").hide() hides the selected DOM element(s). $("selector").show() shows the selected DOM element(s).

$(“selector”)。toggle()在隐藏和显示之间切换选定的DOM元素。 $(“selector”)。hide()隐藏选定的DOM元素。 $(“selector”)。show()显示选定的DOM元素。

Truthfully though, I think you could've solved this problem without having to consult *. The jquery docs are pretty clear imo!

说实话,我认为你可以解决这个问题,而无需咨询*。 jquery文档非常清楚imo!

see the jQuery online documentation for show, hide and toggle.

查看show,hide和toggle的jQuery在线文档。

#5


Hide element:

$('#myElement').hide();

Show element:

$('#myElement').show();

#6