jQuery에서 $()의 세 가지 사용 사례
- php中世界最好的语言원래의
- 2018-04-23 10:56:291282검색
이번에는 jQuery의 세 가지 $() 사용 사례를 소개하겠습니다. jQuery의 세 가지 $() 유형을 사용할 때 주의 사항은 무엇입니까? 다음은 실제 사례입니다.
$ 기호는 jQuery "클래스"의 별칭이며 $()는 jQuery 개체를 구성합니다. 따라서 "$()"는 jQuery의 constructor라고 할 수 있습니다(개인적인 의견, 하하!).
1. $()는 $(expression), 즉 css selector, Xpath 또는 html 요소일 수 있습니다. 즉, 대상 요소는 위의 표현식을 통해 일치됩니다.
예를 들어 $("a")로 생성된 객체는 CSS 선택기를 사용하여 jQuery 객체를 생성합니다. 이는 모든 7d01d0a03a49fceb57d12197d8d196cb 태그를 선택합니다. 예:
$("a").click(function(){...})
은 페이지의 링크를 클릭할 때 트리거 이벤트입니다. 정확하게 말하면 jQuery는 7d01d0a03a49fceb57d12197d8d196cb 태그를 사용하여 $("a") 객체를 생성하며 click() 함수는 이 jQuery 객체의 (이벤트) 메서드입니다.
예를 들어 다음과 같은 HTML 코드가 있습니다.
<p>one</p> <p> <p>two</p> </p> <p>three</p> <a href="#" id="test" onClick="jq()" >jQuery</a>
이 HTML의 작업은 다음 명령문입니다.
alert($("p>p").html());$()는 쿼리 표현식입니다. 즉, "p>p와 같은 쿼리 표현식을 사용합니다. " jQuery 개체가 생성된 다음 "html()"은 위 HTML 코드 조각의 [2]인 html 콘텐츠를 표시한다는 의미입니다. 또 다른 예:
$("<p><p>Hello</p></p>").appendTo("body");$()는 문자열입니다. 이러한 문자열을 사용하여 jQuery 개체를 구성한 다음 이 문자열을 b2636b4e0e32f7cd731b9073897693b7에 추가합니다.
2. $()는 특정 DOM 요소인 $(element)일 수 있습니다. 예를 들어 일반적으로 사용되는 DOM 개체에는 문서, 위치, 양식 등이 포함됩니다. 다음 코드 줄은
$(document).find("p>p").html());
$()中的document是一个DOM元素，即在全文寻找带<p>的<p>元素，并显示<p>中的内容。3입니다. $()는 $(function), 즉 $(document).ready()의 약어일 수 있습니다. 예를 들어, 일반적인 형식은 다음과 같습니다:
$(document).ready(function(){
alert("Hello world!");
});변수 연산:
$(function(){
alert("Hello world!");
});HTML 문서에서 요소를 선택하기 위해 jQuery에는 두 가지 방법이 있습니다.
1) $("p>ul a")와 같은, 그것의 It p 태그의 ul 태그에 있는 a 태그를 의미합니다
단, $('p>ul') 와 $('p ul') 에는 차이가 있습니다.
$('p>ul')是<p>的直接后代里找<ul>； 而$('p ul')是在<p>的所有后代里找<ul>。
2) jQuery 객체의 여러 메소드를 사용하세요 ( find(), Each() 등의 메소드)
$("#orderedlist).find("li")는 $("#orderedlist li").each()가 모든 li를 반복하는 것과 같습니다. 표현식 "#"은 HTML의 ID를 나타냅니다. 예를 들어 위의 예에서 "#orderedlist"는 "ID가 orderlist가 위치한 태그입니다"라는 의미입니다.
****************** *****.******************************************** *
1, 태그 선택 선택자 $('p'), class 선택자 $('.myClass') 및 id 선택자 $('#myId')는 상대적으로 간단하여 할 말이 많지 않지만, 한 가지입니다 - $('p>ul.')과 $('p ul')은 다릅니다.
$('p>ul')은 e388a4556c0f65e1904146cc1a846bee의 직계 자손의 ff6d136ddc5fdfeffaf53ff6ee95f185에서 발견됩니다. $('p ul')은 ;p>의 모든 자손에서 ff6d136ddc5fdfeffaf53ff6ee95f185에서 발견됩니다. 따라서 $('#sId>li')는 ID가 "sId"인 모든 25edfb22a4f469ecb59f1190150159c6 , 비록 이것이 찾고 있는 범위가 아닌 25edfb22a4f469ecb59f1190150159c6 .horizontal)')은 클래스를 참조합니다. "sId"라는 이름에 li의 모든 자손에는 수평 클래스의 요소가 없습니다. 여기서는 부정 의사 클래스가 있습니다.
여기에 반환되는 것은 jQurey 객체입니다. , 배열 객체 및 이 jQuery 객체의 길이를 사용할 수 있습니다.
2. 이는
속성 선택기
입니다.
[]에는 @가 없습니다. []가 요소의 자손임을 나타냅니다. $('ul li') 및 $('ul[li]')는 모두 jQuery 배열을 반환하지만 둘의 의미는 정반대입니다. 전자는 25edfb22a4f469ecb59f1190150159c6의 하위 항목을 모두 찾는 것이고, 후자는 하위 항목이 25edfb22a4f469ecb59f1190150159c6인 모든 ff6d136ddc5fdfeffaf53ff6ee95f185 배열을 찾는 것입니다. XPath에서 "...로 시작하는" 속성을 찾으려면 ^=를 사용하세요. 이름 속성이 mail로 시작하는 입력 요소를 찾으려면
$('input[@name^=" mail" ]')
"...로 끝나는" 속성을 찾으려면 $=를 사용하세요.
"시작이나 끝이 없는" 속성을 찾으려면 *=
3을 사용하세요. 위에 속하지 않는 선택자 - 언급된 CSS 및 XPath는 ":"으로 표시되는 사용자 정의 선택기입니다. 여기서 사용되는 내용은 다음과 같습니다.
first，:last，:parent ，:hidden，:visible，:odd，:even，:not('xxx')， ":eq(0)"（始于0)，:nth(n），:gt(0)，:lt(0)，:contains("xxx")
如：$('tr:not([th]):even')意为a34de1251f0d9fe1e645927f19a896e8元素的子孙中不含b4d429308760b6c2d20d6300079ed38e的所有子孙的偶数项
4、还有几个，简单不解释了
$('th').parent()——
$('td:contains("Henry")').prev()——内容包含有"Henry"的<td>的上一个节点
$('td:contains("Henry")').next()——内容包含有"Henry"的<td>的下一个节点
$('td:contains("Henry")').siblings()——内容包含有"Henry"的<td>的所有兄弟节点还有一个，就是end()，这个方法肯定是用在某个DOM节点执行了某一动作之后，还想在与其相关的节点上执行类似动作，这里就要用到end()。用过end()方法之后，所返回的是执行动作的那个节点的父节点上。举个例子
$(...).parent().find(...).addClass().end()
这里执行动作的节点是find(...)，是一个数组对象，它所做的动作是“addClass()”，之后，用了个end()，这时所返回的东东就是指向了parent()所指向的节点，也就是执行“addClass()”动作的那个数组对象的父节点。
5、要直接访问DOM元素，可用get(0)的方法，如
$('#myelement').get(0)，也可缩写成$('#myelement')[0]
相信看了本文案例你已经掌握了方法，更多精彩请关注php中文网其它相关文章！
推荐阅读：
위 내용은 jQuery에서 $()의 세 가지 사용 사례의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!