jQuery②
8909 단어 jQuery
선택기 사용---jQuery 요소 검색
기술하는 방법은 다음과 같다.
$(セレクタ);
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja" dir="ltr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<title>jQuery-test02</title>
</head>
<body>
<div id="div1">
<span id="span1"></span>
<span id="span2"></span>
</div>
<div id="div2">
<span id="span3"></span>
<span id="span4"></span>
</div>
<script type="text/javascript">
$(function(){
// すべてのdiv要素を取得
var $div = $('div');
console.log($div);
//=> <div id="div1">...</div>, <div id="div2">...</div>
// id名がdiv1の要素を取得
var $div1 = $('#div1');
console.log($div1);
//=> <div id="div1">...</div>
// id名がdiv1の子要素のspan要素を取得
var $span = $('#div1 span');
console.log($span);
//=> <span id="span1"></span>, <span id="span2"></span>
});
</script>
</html>
위에서 설명한 바와 같이, 기본적으로 "CSS의 선택기"를 직접 사용할 수 있습니다.
자신의 jQuery 선택기
jQuery의 선택기도 있습니다. 아래와 같습니다.
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja" dir="ltr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<title>jQuery-test02</title>
</head>
<body>
<div id="div1">
<span id="span1"></span>
<span id="span2"></span>
</div>
<div id="div2">
<span id="span3"></span>
<span id="span4"></span>
</div>
<script type="text/javascript">
$(function(){
// すべてのdiv要素のうち、2番目の要素(指定する数字は0からスタート)を取得
var $div2 = $('div:eq(1)');
console.log($div2); //=> <div id="div2">...</div>
});
</script>
</html>
평론에 쓴 바와 같다
eq(1) 네div 원소의 두 번째 원소를 지정하는 jQuery 자신의 선택기.
Reference
이 문제에 관하여(jQuery②), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/tsukishimaao/items/56c7872cf75bcc7f45c4텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
좋은 웹페이지 즐겨찾기
