jQuery juery와 기본 js의 차이점

앞서 jquery에 대한 몇 가지 기본 사항을 살펴보겠습니다.

jquery 객체와 DOM 객체

jQuery 객체와 DOM 객체는 다릅니다. 아래 예를 사용하겠습니다. 둘의 차이점을 설명하자면

먼저, js 네이티브 코드는 다음과 같습니다.

var div = document.getElementById('dv');
div.innerHTML ="php Chinese website";

위 코드에서 네이티브 DOM 모델이 제공하는 document.getElementById("dv") 메소드를 통해 얻은 DOM 요소가 DOM 객체이고, 텍스트는 innerHTML을 통해 처리됩니다.

아래 jquery 코드를 살펴보겠습니다

$(function(){

var div = $('#dv');

div. html ("php中文网");

});

$('#dv') 메소드를 사용하면 $p라는 jQuery 객체를 얻을 수 있습니다. 여기서 $p는 배열 같은 객체. 이 개체는 DOM 개체의 정보를 포함하고 있으며 많은 작업 메서드를 캡슐화합니다. 자체 메서드인 html 및 css를 호출하며 얻은 효과는 표준 JavaScript 처리 결과와 일치합니다.

표준 JavaScript를 통한 DOM 운영과 jQuyer를 통한 DOM 운영 비교

1. jQuery 메소드로 래핑된 객체는 배열형 객체입니다. DOM 개체와 완전히 다른 점은 둘 다 DOM을 작동할 수 있다는 점입니다.

2. jQuery를 통해 DOM 작업을 처리하면 개발자는 어떤 DOM 노드에 그러한 메서드가 있는지 구체적으로 알 필요도 없고 호환성 문제에 신경 쓸 필요도 없이 비즈니스 로직 개발에 더 집중할 수 있습니다. 다양한 브라우저의 경우 jQuery에서 제공하는 API를 통해 개발하므로 코드가 더욱 간소화됩니다.


지속적인 학습
||
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>jquery</title> <style type="text/css"> #dv{ width:150px; height:150px; border:1px solid red; } </style> <script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script> <script type="text/javascript"> // window.onload=function(){ // var div = document.getElementById('dv'); // div.innerHTML="php 中文网"; // } $(function(){ var div = $('#dv'); div.html("php中文网"); }); </script> </head> <body> <div id="dv"></div> </body> </html>
  • 코스 추천
  • 코스웨어 다운로드
현재 코스웨어를 다운로드할 수 없습니다. 현재 직원들이 정리하고 있습니다. 앞으로도 본 강좌에 많은 관심 부탁드립니다~
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트:공공복지 온라인 PHP 교육,PHP 학습자의 빠른 성장을 도와주세요!