>웹 프론트엔드 >JS 튜토리얼 >일반적인 JavaScript 함수 라이브러리_javascript 기술에 대한 자세한 설명

일반적인 JavaScript 함수 라이브러리_javascript 기술에 대한 자세한 설명

WBOY
WBOY원래의
2016-05-16 18:43:591050검색

이를 위해 제가 일상생활에서 자주 사용하는 JavaScript 함수들을 모아두었는데, 다른 JS 라이브러리에서도 흔히 볼 수 있는 함수들입니다. 이제 여러분께 참고가 되기를 바라면서 정리했습니다.
참고: 쉽게 참조할 수 있도록 다음 기능은 모두 CC 개체에 배치되어 있다고 가정합니다.

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

//이 방법은 다음과 같습니다. 가장 일반적으로 사용되는
//선택기만큼 강력하지는 않지만 지정된 노드
function $(id, p)에서 ID로 하위 요소를 확인할 수 있는 작은 향상된 버전도 있습니다. {
//id가 문자 문자열인지 아니면 HTML 노드인지
var iss = id instanceof String || typeof id == "string"
if (iss && !p)
return document.getElementById(id);
//노드인 경우 노드를 직접 반환
if(!iss)
return id
//id와 p가 동일한 요소인 경우 , 직접 return
if(p.id == id)
return p;//상위 노드로 검색
var child = p.firstChild
while (child); 🎜>if (child.id == id )
return child;
//재귀 검색
var v = this.$(id, child)
if (v)
return v;
child = child.nextSibling ;
}
//찾을 수 없으면 null
return null;


코드 복사

코드는 다음과 같습니다. if (object.length === undefine) {
for (객체의 변수 이름)
if (callback.apply(object[name], args) = == false) break;
} else for (var i = 0, length = object.length; i < length; i )
if ( callback.apply(object[i], args) === false) break;
} else {
if (object.length == undefine) {
for (객체의 변수 이름)
if (callback.call(객체[이름], 이름, 객체 [이름]) === false) break;
} else for (var i = 0, length = object.length, value = object[0];
i < length && callback.call(value, i, value) !== false
value = object[ i]) {}
}
return object; 🎜>





코드 복사


코드는 다음과 같습니다.

//Arrayfunction isArray(obj) { return (typeof obj == = "array" || obj 인스턴스of Array) }, //Stringfunction isString(obj) { return (typeof obj === "string" || obj 인스턴스of String );
},
//Function
function isFunction(obj) {
return (typeof obj === "function " || obj 인스턴스of 함수);
},
//숫자 유형
function isNumber(ob) {
return (typeof ob === "number" || ob 인스턴스of Number );
}






코드 복사


코드는 다음과 같습니다.

// 양식의 submittable 요소의 제출 문자열을 반환합니다. //
// // // , user=rock&password=123이 반환됩니다.
// 이 데이터는 encodeURIComponent로 처리되었으며, 영어 이외의 문자도 가능합니다. // 양식 요소에 이름이 없으면 제공되는 ID로 사용됩니다. 문자 이름.
function formQuery(f){
// f, 양식 형식.
var formData = "" , elem = "", f = CC.$(f)
var elements = f.elements;
var length = elements.length
for (var s = 0; s < length; s) {
elem = elements[s]
if (elem .tagName == 'INPUT') {
if ( (elem.type == 'radio' || elem.type == ' checkbox') && !elem.checked) {
계속;
}
if (formData != "") {
formData = "&"
}
formData = encodeURIComponent(elem.name||elem.id) "="
encodeURIComponent(elem.value);
}
return formData;
}






코드 복사


코드는 다음과 같습니다.

/**
* 배열에서 지정된 요소를 제거합니다.
* 매개변수는 정수 첨자 또는 배열 데이터를 전달할 수 있습니다.*/
Array.prototype.remove = (function(p) {
//매개변수는 아래 첨자입니다
if (CC.isNumber(p) ) {
if (p < 0 || p >= this.length) {
throw "Index Of Bounds:" this.length "," p
}
this.splice; ( p, 1)[0];
return this.length;
}
//매개변수는 배열 데이터이며, 최종적으로 연산할 첨자를 찾아야 합니다.
if (this.length > 0 && this [this.length - 1] == p) {
this.pop()
} else {
var pos = this.indexOf(p)
pos != -1 ) {
this.splice(pos, 1)[0];
}
}
return this.length;



Array.prototype.indexOf = (function( obj) {
for ( var i = 0, length = this.length; i < length; i ) {
if (this[i] == obj) return i; return - 1; 🎝>*/
validate: function() {
var args = CC.$A(arguments),
form = null
// 은 빈 요소가 아니며 하나의 매개변수에서 첫 번째 요소에 배치되어야 합니다.
if (!CC.isArray(args[0])) {
form = CC.$(args[0]);
args.remove(0);
}
//설정 항목이 있으면 마지막 매개변수에 배치해야 합니다. //cfg.queryString = true|false; >//cfg.callback = 함수 //cfg.ignoreNull //nofocus:true|false var b = CC.isArray(b) {}: args.pop(), d; var queryStr = b.queryString,
ignoreNull = b.ignoreNull,
cb = b.callback;
var result = queryStr ? Each(args,
function(i, v) {
//fomr에 name 요소가 없으면 이를 ID로 사용하여
var obj = v[0].tagName ? v를 얻습니다. [0] : 양식 ? 양식[v[0]] : CC.$( v[0])
//console.debug('확인 필드:',v, '현재 값:' obj.value) ;
var value = obj.value,
msg = v[ 1],
d = CC.isFunction(v[2]) ? v[3] : v[2]/ /Option
if (!d || typeof d != 'object' ) d = b
//null 무시 여부
if (!d.ignoreNull && (value == '' || value == null)) {
//콜백 함수가 없으면 경고를 호출하여 오류 정보를 표시합니다
if (!d.callback) CC.alert(msg, obj, form)
//콜백이 있는 경우 전달된 세 가지 매개변수에 주의하세요
//msg: 메시지, obj: 노드, 양식: 해당 양식(존재하는 경우)
else d.callback(msg, obj, form);//오류 발생 후 수집 여부
if (!d.nofocus) obj.focus()
result = false
return false; //맞춤 확인 방법
if (CC.isFunction(v[2])) {
var ret = v[2](value, obj, form)
var pass = (ret !== false);
if (CC.isString(ret)) {
msg = ret;
pass = false
}
if (!pass) {
if (!d .callback) CC.alert(msg, obj, form);
//위와 동일
else d.callback(msg, obj, form)
if (!d.nofocus) obj.focus ();
result = false;
return false;
}
}
//queryString이 설정되지 않고 확인이 통과되었으며 양식이 존재하지 않는 경우
//이 개체에는 {elementName|elementId:value} 형식의 데이터가 포함되어 있습니다.
if (queryStr && !form ) {
result = (result == '') ? (typeof obj.name == 'undefine' || obj.name == '') ? obj.id: obj.name)
'=' value: '&' v[0] '=' value; 🎜>} else if (!form) {
result[v[0]] = value;
}
} )
//queryString:true가 설정되고 확인이 통과된 경우, 양식 제출 문자열이 반환됩니다.
if (result !== false && form && queryStr) result = CC.formQuery(form)
return result; >



코드 복사


코드는 다음과 같습니다.


/**
* JS의 동적 언어 기능을 활용한 다양하고 간단한 양식 검증 기능입니다.
* 실제로 보면 매우 생생합니다. 🎜>*/
templ: function(obj, str, st) {
return str.replace(/{([w_$] )}/g, function(c, $1 ) {
var a = obj[$1];
if (a === 정의되지 않음 || a === null) {
if (st === 정의되지 않음) return ''
스위치(st) {
case 0:
return ''; 사례 1:
return $1;
return c;
}
return a; }

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.