jQuery를 적용하는 방법:숨겨진 선택기?
- 黄舟원래의
- 2017-06-23 11:41:021351검색
Overview
모든 보이지 않는 요소 또는 숨겨진 유형의 요소와 일치합니다.
Example
설명:
숨겨진 tr
HTML 코드:
<table> <tr style="display:none"><td>Value 1</td></tr> <tr><td>Value 2</td></tr> </table>
j쿼리 코드:
$("tr:hidden")결과:
[ <tr style="display:none"><td>Value 1</td></tr> ]
설명:
숨겨진 유형의 요소와 일치
HTML 코드:
<form> <input type="text" name="email" /> <input type="hidden" name="id" /> </form>
j쿼리 코드:
$("input:hidden") 결과:
[ <input type="hidden" name="id" /> ]
이 선택기는 일반적으로 클래스 선택기 및 요소 선택기 와 같은 다른 선택기와 함께 사용됩니다. 그리고 더. 예:
$("div:hidden").css({display:"block",color:"blue"})위 코드는 숨겨진 div 요소가 표시되도록 설정하고 내부 글꼴 색상을 파란색으로 설정할 수 있습니다.
다른 선택기와 함께 사용되지 않는 경우 기본 state가 * 선택기와 함께 사용됩니다. 예를 들어 $(":hidden")은 $("*:hidden")과 동일합니다.
예제 코드:
위 코드는 숨겨진 div가 표시되도록 설정하고 내부의 텍스트 색상을 파란색으로 설정할 수 있습니다.
예제 2:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.jb51.net/" />
<title></title>
<style type="text/css">
.display {
display:none;
}
</style>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$(":hidden").css({display:"block",color:"blue"});
})
})
</script>
</head>
<body>
<div class="display">我是后来才可见的</div>
<div>我是本来就是可见的</div>
<p class="display">我原来也是不可见的</p>
<button>点击查看效果</button>
</body>
</html>위 코드에서는 :hidden 선택기와 함께 사용할 선택기를 지정하지 않았으므로 기본적으로 * 선택기와 함께 사용됩니다. 따라서 코드에서는 숨겨진 요소를 모두 표시하고 표시할 수 있습니다. .텍스트 색상은 파란색으로 설정됩니다.
위 내용은 jQuery를 적용하는 방법:숨겨진 선택기?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.