jQuery에서 달러 기호 $는 무엇을 합니까?
- 青灯夜游원래의
- 2021-01-19 13:53:175834검색
jQuery에서 달러 기호 "$"의 역할: 1. 선택기를 사용하여 DOM 요소 선택 2. 여러 일반적인 유틸리티 함수의 네임스페이스에 대한 접두사로 사용 4. jQuery를 확장합니다. 5. "window.onload" 함수의 충돌을 해결합니다.
이 튜토리얼의 운영 환경: windows7 시스템, jquery1.12.4 버전, Dell G3 컴퓨터.
추천 튜토리얼: jq 튜토리얼
1.Selector
CSS에서 선택기의 기능은 페이지에서 특정 유형의 요소(카테고리 선택기) 또는 특정 요소(ID 선택기)를 선택하는 것입니다.
및 선택기로 사용되는 jQuery의 "$"도 특정 유형의 요소를 선택하지만 jQuery는
더욱 포괄적인 선택 방법을 제공합니다. 그리고 사용자를 위한 브라우저 호환성 문제를 처리합니다.
(1) CSS는 다음 코드를 사용하여 c1a436a314ed609750bd7c7d319db4da 태그 아래에 포함된 모든 하위 태그 3499910bf9dac5ae3c52d5ede7383485를 선택한 다음 해당 스타일을 추가할 수 있습니다.
h2 a{
/添加CSS属性/
}그리고 jquery에서 다음 코드를 사용하면 c1a436a314ed609750bd7c7d319db4da 태그 아래에 포함된 모든 하위 태그 3499910bf9dac5ae3c52d5ede7383485를 javascript
$("h2 a")에서 사용할 객체 배열로 선택할 수 있습니다. (2) jquery에서 선택기의 일반적인 구문은 다음과 같습니다.
$(selector)
또는
jQuery(selector)
selector가 CSS3 표준을 준수하는 경우
(3) javascript의 document.getElementById("#showp"")와 동일한 id 선택기
jQuery의 표현 방법이 훨씬 간단하다는 것을 알 수 있습니다
$("#showp“)(3) 카테고리 선택기는 CSS 카테고리를 "SomeClass"의 모든 노드 요소로 선택합니다. javascript에서 동일한 선택을 달성하려면
for 루프를 사용하여 전체 DOM을 탐색해야 합니다
$(".SomeClass")(4) 모두 선택 e388a4556c0f65e1904146cc1a846bee 홀수 라인 마크에 위치하며, 거의 모든 마커는 홀수 및 짝수 선택을 위해 ":홀수" 또는 ":짝수"를 사용할 수 있습니다.
$("p : odd")(5) 모든 테이블 행의 첫 번째 셀은 첫 번째 열입니다. 테이블의 특정 부분을 수정할 때 더 이상 테이블을 한 행씩 이동할 필요가 없습니다.
$("td:nth-child(1)")(6) 하위 선택기, 25edfb22a4f469ecb59f1190150159c6 a>, sun 태그 제외
$("li > a")(7 ) 모든 하이퍼링크를 선택하면 해당 하이퍼링크의 href 속성이 "pdf"로 끝납니다. 속성 선택기를 사용하면 페이지에서 다양한 특성 요소를 선택할 수 있습니다
("a[ href=pdf". ]")
Note:
jQuery의 달러 기호 "$"는 실제로 "jQuery"와 동일합니다. 작성의 편의를 위해 jQuery
의 소스 코드에서 볼 수 있습니다. 코드에서는 일반적으로 "jQuery" 대신 "$"가 사용됩니다.
2. 함수 접두어
JavaScript에서 개발자는 예를 들어 사용자가 제출할 때 다양한 작업 세부 사항을 처리하기 위해 몇 가지 작은 함수를 수행해야 하는 경우가 있습니다.
텍스트 상자를 넣어야 합니다. JavaScript는 Trim()과 유사한 기능을 제공하지 않습니다.
jQuery를 도입한 후에는 다음과 같은 Trim() 함수를 직접 사용할 수 있습니다.
$.trim(sString);
위 코드는
jQuery.trim(sString);
trim() 함수는 jQuery 개체의 메서드입니다.
3 window.onload 함수의 충돌을 해결합니다.
HMTL 페이지의 프레임워크를 사용하려면 완전히 로드해야 하며, DOM을 프로그래밍할 때 window.onload가 사용됩니다.
함수가 자주 사용됩니다. 이 함수를 페이지의 여러 위치에서 사용해야 하거나 다른 .js 파일에도 window.onload 함수가 포함되어 있으면 충돌 문제가 매우 어렵습니다. jQuery의 Ready() 메서드는 위의 문제를 매우 잘 해결할 수 있습니다. 페이지가 로드된 후 자동으로 기능을 실행합니다.
여러 개의 Ready() 메소드를 서로 충돌하지 않고 동일한 페이지에서 사용할 수 있습니다. 예를 들어
$(document).ready(function(){
$("table.datalist tr:nth-child(odd)").addClass("altrow");
});jQuery는 위 코드에 대한 약어도 제공하므로 "(document).ready" 부분을 생략할 수 있습니다. 코드는 다음과 같습니다.
$(function(){
$("table.datalist tr:nth-child(odd)").addClass("altrow");
});
4 DOM 요소 만들기
DOM 메서드 사용 요소 노드를 생성하려면 일반적으로 document.createElement(), document.create TextNode() 및 appendChild()를 함께 사용해야 하는데 이는 매우 번거로운 작업입니다. 그러나 jQuery에서는 "$" 기호를 사용할 수 있습니다. DOM 요소를 직접 생성합니다. 예를 들어
var oNewP = $("e388a4556c0f65e1904146cc1a846beeThis is a good story5f557f62ae7ac7a14e0b1cb564790dfc")
위 코드는 javascript의 다음 코드와 동일합니다.
var oNewP = document.createElement("p");// 新建节点
var oText = document.createTextNode("这是一个好故事");
oNewP.appendChild(oText);또한 jQuery는 insertAfter of DOM 요소() 메서드의 의사 코드는 다음과 같습니다.
$(function(){ // ready函数
var oNewP = $("<p>这是一个好故事</>");// 创建DOM元素
oNewP.insertAfter("#myTarget");// insertAfter()方法
});
<body>
<p id="myTarget">插入到这行文字之后</p>
<p>也就是插入到这行文字之前，但这行没有id,也可能不存在</p>
</body>
5. "$"
jQuery를 추가하여 사용자 정의하면 모든 사용자의 요구 사항을 모두 충족할 수 없으며 일부 특별한 요구 사항은 매우 틈새적이고 적합하지 않습니다. jQuery 프레임워크에서는 사용자가 이 방법을 사용자 정의할 수 있습니다. 코드는 다음과 같습니다:
$.fn.disable = function(){
return this.each(function(){
if(typeof this.disabled != "undefined") this.disabled = true;
});
}以上代码首先设置".fn.disable",表明为""添加一个方法“disable()”,其中“$.fn”是扩展jQuery时所必须的
然后利用匿名函数定义这个方法，即用each()将调用这个方法的每个元素的disabled属性均设置为true(如果该属性存在)
6、解决"$"的冲突
如果其他框架也是用了“",会引起冲突，jQuery同样提供了noConflict()方法来解决""冲突问题
jQuery.noConflict();
以上代码可以使""按照其他javascript框架的方式运算，这时再jQuery中便不能在使用“”，而必须使用jQuery，
例如$("p p") 必须写成jQuery("p p").
更多编程相关知识，请访问：编程入门！！
위 내용은 jQuery에서 달러 기호 $는 무엇을 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!