jquery의 주요 기능은 무엇입니까?
- 藏色散人원래의
- 2023-03-25 11:24:475293검색
jquery의 주요 기능은 다음과 같습니다. 1. 페이지 프레임의 일부에 액세스합니다. 3. 페이지 콘텐츠를 변경합니다. 4. 페이지에 애니메이션을 추가합니다. 7. 일반적인 JavaScript 작업을 단순화합니다.
이 튜토리얼의 운영 환경: Windows 10 시스템, jquery3.2.1, Dell G3 컴퓨터.
jquery의 주요 기능은 무엇인가요?
jQuery의 주요 기능
1: 페이지 프레임의 일부에 액세스
jQuery는 페이지에서 노드 또는 특정 유형의 노드를 얻는 DOM의 고정 방법을 크게 단순화합니다.
2: 성능을 수정합니다.
브라우저마다 CSS3 표준을 지원하는 방식이 다르기 때문에 CSS3 스타일이 잘 반영되지 않는 경우가 많습니다. jQuery의 출현은 이 문제를 매우 잘 해결합니다. 다양한 브라우저가 CSS3 표준을 잘 사용할 수 있도록 JavaScript 코드를 캡슐화합니다.
3: 페이지 콘텐츠 변경
강력하고 포괄적인 API를 통해 jQuery는 페이지 콘텐츠는 물론 전체 페이지의 프레임까지 쉽게 수정할 수 있습니다.
4: 이벤트에 응답
필요 없음; 브라우저 호환성 문제를 고려하고 이벤트를 더 쉽게 처리할 수 있습니다.
5: 페이지에 애니메이션 추가
jQuery의 라이브러리는 사용자 정의 가능한 매개변수로 수많은 애니메이션 효과를 제공합니다.
6: 서버와의 비동기 상호 작용
jQuery는 완전한 애니메이션 효과를 제공합니다. Ajax 관련 작업 세트는 비동기식 상호 작용의 개발 및 사용을 크게 촉진합니다.
7: 일반적으로 사용되는 JavaScript 작업을 단순화합니다.
jQuery는 배열 작업, 반복 작업 등과 같은 일반적인 JavaScript 작업을 단순화하는 많은 추가 기능을 제공합니다.
jQuery
$(document); // 选择整个文档对象 $("#myId"); // 选择id = 'myId' 的元素 $(".myClass"); // 选择class = 'myClass' 的元素 $("div.myClass"); // 选择class = 'myClass' 的div元素 $("input[name=first]"); // 选择name = 'first' 的 input 元素
$("a:first"); // 选择网页中第一个a元素 $("tr:odd"); // 选择表格中的奇数行 $("#myFrom:input"); // 选择表单中的id='myFrom'的input元素 $("div:visible"); // 选择可见的div元素 $("div:gt(2)"); // 选择所有的div元素，除了前3个 $("div:animated"); // 选择当前处于动画状态的div元素
rreee
$("div").has("p"); // 选择包含p元素的div元素 $("div").not(".myClass"); //选择class != 'myClass' 的div元素 $("div").filter(".myClass"); // 选择class = 'myClass' 的div元素 $("div").first(); // 选择第1个div元素 $("div").eq(5); // 选择第6个div元素 2. 연쇄 연산
jQuery의 가장 칭찬할 점은
jQuery가 동일한 객체에 대해 연속적인 함수 연산을 수행할 수 있다는 점예:$("div").next("p"); // 选择div元素后面的第1个p元素
$("div").parent(); // 选择div元素的父元素
$("div").closest("from"); // 选择离div最近的from父元素
$("div").children(); // 选择div的所有子元素
$("div").siblings(); // 选择div同级的其他兄弟元素（不包括自己） 체인 연산은 jQuery의 가장 편리한 기능은 jQuery가 함수 작업을 실행할 때마다 반환 값이 여전히 원래 작업의 jQuery 개체이므로 나중에 작업을 직접 계속할 수 있기 때문입니다. .end() 메소드 .end() 메소드는 이전 jQuery 객체에 반환 값을 반환합니다. 예: $("div").find("p").addClass("first").removeClass("second").html("third");
// 分解
$("div") // 找到div元素
.find("p") // 选择其中的p元素
.addClass("first") // 添加一个class = 'first'
.removeClass("second") // 删除一个class = 'second'
.text("third"); // 将文本改为 third
3. 추가, 삭제, 수정 및 확인
1. 새 요소: HTML 형식을 준수하는 문자열을 jQuery
$("div") // 找到div元素
.find("p") // 选择其中的p元素
.addClass("first")
.removeClass("second")
.text("third")
.end() // 将jQuery对象从p退回到div
.addClass("myDiv"); // 给div添加一个class = 'myDiv'Copy 요소.clone()에 직접 전달합니다. 현재 jQuery 객체의 복제 복사본을 반환합니다.모든 일치 요소, 일치 요소의 하위 요소, 및 텍스트 노드 2개 매개변수: withDataAndEvents 해당 요소의 데이터 및 바인딩 이벤트를 동시에 복사할지 여부, 기본값은 false deepWithDataAndEvents 모든 하위 요소의 데이터 및 바인딩 이벤트를 복사할지 여부 동시에, 기본값은 첫 번째 매개변수(withDataAndEvents)의 값입니다. 2.DeleteDelete elements
let $myDiv = $("<div class='myDiv'><p>Derek</p></div>"); // 创建新的元素，用变量$myDiv储存
$("body").append($myDiv); // 把$myDiv储存的新元素插入到body中
$("ul").append("<li>list</li>"); // 把新创建的li插入到ul中3.ChangeInsert/Move elements.remove() 不保留被删元素的事件 .detach() 保留被删元素的事件，便于在重新插入文档时使用 .empty() 清空元素内容，但不删除该元素（即删除元素里面的所有节点）위의 두 가지 방법은 동일합니다. 효과그러나 반환 값은 각각 $('div' ) 및 $('p') 이므로 후속 작업에 따라 선택해야 합니다요소 삽입/이동의 다른 두 가지 방법
$("div").insertAfter($("p")); // 把div元素移动到p元素的后面
$("p").after($("div")); // 把p元素移动到div元素的前面 4. 검사를 하나의 getter/setter로 변경합니다동일한 함수에 매개변수를 전달하여 변경/검사 기능을 다르게 구현// 在div内部的 末端 插入内容
$("div").append("插入的部分");
$("插入的部分").appendTo("div");
// 在div内部的 顶端 插入内容
$("div").prepend("插入的部分");
$("插入的部分").prependTo("div");jQuery 공통 값/할당 함수.html() html 콘텐츠 확인/변경 .text() 텍스트 내용 확인/변경.attr() 특정 속성 값 확인/변경.width() 요소 너비 확인/변경.heigth() 높이 확인/변경 of an element.val() 양식 요소의 값을 확인/변경합니다참고: 결과 객체에 여러 요소가 포함된 경우 할당할 때 값이 모든 요소에 할당됩니다. 권장 학습: "jQuery Video Tutorial
"위 내용은 jquery의 주요 기능은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!