일반적으로 사용되는 JavaScript 스크립트 요약 (3)_javascript 기술

배열을 통해 문자열 접합을 확장하면 쉽게 성능 문제가 발생할 수 있습니다

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

함수 StringBuffer() {
This.__strings__ = new Array();
}
StringBuffer.prototype.append = 함수(str) {
This.__strings__.push(str);
이것을 돌려주세요;
}
StringBuffer.prototype.toString = 함수 () {
return this.__strings__.join("");
}
var buffer = new StringBuffer();
buffer.append("안녕하세요 ").append("javascript");
var 결과 = buffer.toString();
경고(결과); //안녕하세요 자바스크립트

코드 소스: https://gist.github.com/hehongwei44/fe71f10e4d2d9295aeab

페이지 뷰포트 스크롤 막대 위치에 대한 보조 기능

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

/*현재 페이지의 높이와 너비를 결정하는 두 가지 함수*/
함수 페이지 높이() {
document.body.scrollHeight를 반환합니다.
}
함수 pageWidth() {
document.body.scrollWidth를 반환합니다.
}
/*스크롤 막대의 가로 및 세로 위치 결정*/
함수 스크롤X() {
var de = document.documentElement;
self.pageXOffset || (de && de.scrollLeft) || document.body.scrollLeft;
}
함수 스크롤Y() {
var de = document.documentElement;
self.pageYOffset || (de && de.scrollTop) || document.body.scrollTop;
}
/*브라우저 뷰포트의 높이와 너비를 결정하는 두 가지 함수*/
함수 windowHeight() {
var de = document.documentElement;
self.innerHeight || (de && de.clientHeight) || document.body.clientHeight;
}
함수 windowWidth() {
var de = document.documentElement;
return self.innerWidth || (de && de.clientWidth) || document.body.clientWidth;
}

코드 소스: https://gist.github.com/hehongwei44/62907b9b7061d4defadb

요소 투명도 조정 기능

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

/*요소 투명도 조정 기능*/
함수 setOpacity(elem, level) {
//IE가 투명성을 처리합니다
If (elem.filters) {
          elem.style.filters = 'alpha(opacity=' level ')';
} 그 밖의 {
           elem.style.opacity = 레벨 / 100;
}
}

코드 소스: https://gist.github.com/hehongwei44/87839cd3b8439aff6a3c

마우스 위치를 얻기 위한 몇 가지 공통 함수

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

/*전체 페이지를 기준으로 마우스의 현재 위치를 얻는 데 사용되는 두 가지 일반 함수*/
함수 getX(e) {
e = e || window.event;
e.pageX 반환 || e.clientX document.body.scrollLeft;
}
함수 getY(e) {
e = e || window.event;
e.pageY 반환 || e.clientY document.body.scrollTop;
}
/*현재 요소를 기준으로 마우스 위치를 가져오는 두 가지 함수*/
함수 getElementX(e) {
반환(e && e.layerX) || window.event.offsetX;
}
함수 getElementY(e) {
반환(e && e.layerY) || window.event.offsetY;
}

코드 소스: https://gist.github.com/hehongwei44/2732365bd42baa491ef8

cssdisplay 속성을 사용하여 요소의 가시성을 전환하는 함수 세트

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

/**
* 디스플레이를 사용하여 요소 숨기기
**/
함수 hide(elem) {
var curDisplay = getStyle(elem, 'display');

if (curDisplay != 'none') {
          elem.$oldDisplay = curDisplay;
}
elem.style.display = '없음';
}
/**
* 디스플레이를 사용하여 요소의 기능을 표시
**/
함수 표시(elem) {
elem.style.display = elem.$oldDisplay || }

코드 소스:

https://gist.github.com/hehongwei44/b4192af8227d756bfda6

스타일 관련 일반 기능

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

/**
* 지정된 요소(elem)의 스타일 속성(이름)을 가져옵니다
**/
function getStyle(요소, 이름) {
//style[]에 존재하는 경우 설정된 것입니다(현재 상태입니다)
If (elem.style[이름]) {
           return elem.style[이름];
}
//그렇지 않으면 IE 테스트 방법
else if (elem.currentStyle) {
           return elem.currentStyle[이름];
}
//또는 W3C 방법
​ else if(document.defaultView && document.defaultView.getComputeStyle){
name = name.replace(/(A-Z)/g, "-$1");
          이름 = name.toLowerCase();
          var s = document.defaultView.getComputeStyle(elem, "");
          return s && s.getPropertyValue(name);
}
//그렇지 않으면 사용자가 다른 브라우저를 사용하고 있는 것입니다
그렇지 않으면 {
        null을 반환합니다.
}
}

코드 소스:

https://gist.github.com/hehongwei44/9abf63536accd0f2eeb7

요소의 현재 높이와 너비를 가져옵니다

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

/**
* 요소의 실제 높이를 가져옵니다
* 종속 getStyle에 대해서는 위 함수를 참조하세요.
**/
함수 getHeight(elem) {
반환 parInt(getStyle(elem, 'height'));
}
/**
* 요소의 실제 너비를 가져옵니다
* 종속 getStyle에 대해서는 위 함수를 참조하세요
**/
함수 getWidth(elem) {
반환 parInt(getStyle(elem, 'width'));
}

코드 소스:

https://gist.github.com/hehongwei44/b524ff25991d99625eb2

위 내용은 이 기사에서 공유하는 일반적으로 사용되는 JavaScript 스크립트입니다. 모두 마음에 드셨으면 좋겠습니다.