> 웹 프론트엔드 > JS 튜토리얼 > 경량 자바스크립트 라이브러리 pj Introduction_lib_js

경량 자바스크립트 라이브러리 pj Introduction_lib_js

WBOY
풀어 주다: 2016-05-16 18:13:43
원래의
1710명이 탐색했습니다.

다른 언어에 비해 JavaScript 스크립트 언어는 너무 작고 정교하며 활기차고 똑똑합니다. 저는 개인적으로 자바스크립트 코드 작성을 아주 좋아합니다. 인터넷에는 jQuery, Prototype, Base, ExtJs...와 같은 유명한 자바스크립트 라이브러리가 가득하지만 매우 강력하고 사용하기 쉽습니다. 하지만 그다지 만족스럽지 못한 점 중 하나는 도서관 자체가 너무 크다는 점입니다. 때로는 몇 가지 기능을 사용하기 위해 전체 라이브러리를 가져와야 하는 경우도 있습니다. jQuery의 경우 압축 후에도 여전히 70KB를 초과하며 이는 웹 페이지 파일보다 큰 경우도 있습니다. 하지만 개발을 지원하려면 라이브러리가 필요하므로 몇 가지 간단한 선택기만 지원하는 경량 자바스크립트 라이브러리를 작성했습니다. 많은 선택기에서 jQuery의 메서드를 빌려와 이름을 pj로 지정했습니다.
여기는
선택기에 대한 간략한 소개:
pj("#id");//id 선택기(예: pj("#header"), id를 헤더 요소로 사용
pj( "tag");//태그 선택기(예: pj("div"), 페이지의 모든 div 가져오기
pj("[tag].class");//class 선택기, 예: pj( "[tag].ClassName"), 클래스가 ClassName
pj("#id>tag")인 [tag] 요소를 가져옵니다. //다음과 같이 지정된 ID 아래에 지정된 모든 요소를 ​​가져옵니다. header>a"), ID를 헤더 요소(하위 요소 포함) 아래의 모든 요소로 취합니다.
pj("tag>tag");//지정된 태그 아래에 지정된 태그의 모든 요소를 ​​가져옵니다. as: pj("li>a") 페이지의 모든 li 요소(하위 요소 포함) 아래에서 a 요소를 가져옵니다.
pj("tag[,#id,tag.class][attr=value]:0, 2"); //지정된 속성 또는 아래 첨자를 기반으로 요소를 가져옵니다. 예: pj("div[name=value]:0,3") 이름 속성을 포함하고 다음을 갖는 페이지의 첫 번째 및 네 번째 요소를 가져옵니다. 값
pj("

");//div 생성
pj("
Content
");//콘텐츠가 포함된 div 생성
정적 속성 및 메서드
LEFT_POSITION
RIGHT_POSITION
TOP_POSITION
BOTTOM_POSITION
LEFT_TOP_POSITION
LEFT_BOTTOM_POSITION
RIGHT_TOP_POSITION
RIGHT_BOTTOM_POSITION
준비(fn) extend(target,fn);
bind({method:function(){}})
isObject(elem)
isFunction(elem)
isArray(elem)
isString(elem )
trim(str)
merge(target,src)
getStyle(target,name)
setStyle(target,{})
mouseX(e)
mouseY(e)
stopBubble(e)
stopDefault(e)
pageHeight()
pageWidth()
windowHeight()
windowWidth()
setOpacity(target,value)
활성화Drag( 트리거, 대상)
parseToQueryString(form)
isContain(parent,child)
id(id)
tag(tag)
resetCSS(target,{})
x (target )
y(target)
wh(target,name)
pj 객체 속성 및 메서드
timer
length
get()
each()
addListener( )
attr()
removeAttr()
stop()
appendTo()
remove()
addClass()
removeClass()
setClass( )
cut()
step()
setLocationRelatedTo()
isVisible()
locate()
bind()
getStyle()
setStyle()
abort()
blur()
change()
click()
dblclick()
error()
focus()
keydown()
keypress( )
keyup()
load()
unload()
mousedown()
mousemove()
mouseout()
mouseover()
mouseup( )
reset()
resize()
select()
submit()
left()
top()
right()
bottom()
height()
width()
animate()
slideDown()
slideUp()
slideRight()
slideLeft()
scrollDown()
scrollUp( )
scrollRight()
scrollLeft()
hide()
show()
fadeIn()
fadeOut()
소형 데모

코드 복사 코드는 다음과 같습니다.



<머리>

无标题文档


<본문>








打包下载地址 http://www.jb51.net/jiaoben/33561.html
관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿