너는 jQuery 필요 없어(둘)

3216 단어
jQuery의 뜻을 완전히 부정하지 않았다. jQuery는 신기하고 매우 유용한 도구로 우리의 많은 시간을 절약할 수 있다.
그러나 때때로, 우리는 jQuery의 작은 기능 하나만 있으면 작은 임무를 완성할 수 있고, 전체 jQuery 프로그램 라이브러리를 불러올 필요가 전혀 없다.다음은 간단한 JavaScript로 jQuery 기능 특징을 실현하는 코드 요약입니다.물론 이 총결산은 완전하지 않으니, 너는 그래도 를 보는 것이 좋겠다.
검색 찾기(선택기)
ID별로 찾기:
$('#foo')
document.getElementById('foo')

class 이름으로 검색하기
$('.bar')
document.getElementsByClassName('bar')

태그 이름으로 검색하기
$('span')
document.getElementsByTagName('span')

하위 요소로 검색하기
$('#foo span')
document.getElementById('foo').getElementsByTagName('span')

특수 요소 검색하기
$('html')
document.documentElement

$('head')
document.head

$('body')
document.body

요소 속성 작업
HTML 가져오기/설정:
$('#foo').html()
document.getElementById('foo').innerHTML

$('#foo').html('Hello, world!')
document.getElementById('foo').innerHTML = 'Hello, world!'

추가/삭제/검색 판단class:
$('#foo').addClass('bar')
document.getElementById('foo').className += ' bar '

$('#foo').removeClass('bar')
document.getElementById('foo').className = document.getElementById('foo').className.replace(/\bbar\b/gi, '')

$('#foo').hasClass('bar')
document.getElementById('foo').className.search(/\bbar\b/gi) !== -1

요소 값:
$('#foo').val()
document.getElementById('foo').value

 
특수효과
숨기기/표시 작업:
$('#foo').show()
document.getElementById('foo').style.display = ''

$('#foo').hide()
document.getElementById('foo').style.display = 'none'

CSS 스타일을 수정하려면 다음과 같이 하십시오.
$('#foo').css('background-color', 'red')
document.getElementById('foo').style.backgroundColor = 'red'

  
이벤트
페이지 로드 완료(ready)
jQuery에서 우리가 가장 자주 사용하는 것은$(document).ready이다.다음 대체 방법은 다음과 같습니다.
document.onreadystatechange = function() {
    if (document.readyState === 'complete') {
        // DOM is ready!
    }
};

  
클릭 이벤트
$('#foo').click(function() { ... })
document.getElementById('foo').onclick = function() { ... }

 
 
AJAX
새 버전의 자바스크립트 API는 aax를 실현할 수 있는 새로운 API-fetch를 제공합니다. 이api는 새로운 Promise 구조를 채택하여 사용하기에 더욱 편리하고 유연합니다. 상세한 사용법은 을 참고하십시오.
공구류 기술
분석 JSON:
jQuery.parseJSON(json)
JSON.parse(json)

 
총결산
위의 코드를 보면 jQuery의 많은 기능들이 간단한 자바스크립트 코드로 이루어질 수 있음을 알 수 있다.jQuery는 사용하기 좋지만 부피의 부담이 있습니다. 만약에 문제가 생기면 간단한 코드로 jQuery를 불러오지 않아도 됩니다. 이것은 더욱 효율적이고 실용적인 방법이 아닌가요?

좋은 웹페이지 즐겨찾기