2007년 12월 23일 업데이트됨 무한한 창의성, 간단하고 실용적인 (자바스크립트 로그)_자바스크립트 기술

JavaScript 개발 과정에서 항상 경고 메서드를 사용하여 프로그램을 디버깅한다면 일부 간단한 프로그램에서는 가능합니다.
그러나 매우 복잡한 일반적인 프로젝트에서는 이 방법이 이미 만족하기 어렵습니다. 기업 수준의 개발 요구 사항을 충족하기가 어렵습니다.
예를 들어 ajax 프로젝트에는 약 3,000줄의 JS 파일이 있는데, 여기에는 다양한 맞춤형 자바스크립트 객체가 있습니다.
개발 과정에서 js 프로그램이 특정 키 포인트에 도달하면 항상 커스텀 객체의 값이나 상태를 모니터링해야 합니다.
실행 결과가 예상한 대로인지 판단합니다. 값을 특정 개체와 연관시키는 것은 어렵습니다.
다음과 같은 두 가지 명백한 단점이 있습니다.
1. 언제든지 모니터링하려는 실행에 n개의 핵심 포인트가 있는 경우 경고를 사용하면 확인하기 위해 n번 클릭할 필요가 없습니다. 개발자의 기분이 매우 일관되지 않고 직관적이지 않으며, 깊게 숨겨진 문제를 원활하게 발견하기 어렵습니다.
2. 디버깅에 사용된 경고 문은 게시할 때 삭제해야 합니다. 언젠가 다시 디버깅해야 할 경우 이전 키 포인트를 각각 호출하고 경고를 추가해야 하며 디버깅이 어렵습니다.
이 도구를 사용하면 위의 두 가지 문제가 쉽게 해결됩니다.
위의 요구 사항을 고려하여 단순성과 실용성을 원칙으로
이 자바스크립트 디버깅 도구는 전체 프로그램이 300kb 정도에 불과합니다.
이 도구는 주로 다음과 같은 기능을 가지고 있습니다:
1. 완전히 연결 가능하며 대상 프로그램에 부정적인 영향을 미치지 않습니다.
2. 사용 방법은 간단하고 편리합니다. JS 코드 한 줄만 도입하면 됩니다.
사용하고 나면 JS 프로그램 디버깅이 더욱 편리해지는 것을 느낄 수 있습니다.

//---------사용방법---- - --------------------------//
1단계. 다운로드 후 D:toolsJSDebugTool
2단계. 대상 프로그램(JSP, ASP, HTML, PHP 등)에 다음과 유사한 JS 코드 줄을 추가합니다. 다음 작성 방법 모두 지원됩니다.
debug=true/false
true : Javascript 디버그 기능이 켜져 있고, 기본값입니다. (개발용)
false : Javascript 디버그 기능이 꺼져 있습니다. 🎜> "debug" 매개변수가 설정되지 않은 경우 기본값은 true입니다. src 속성은 (절대 경로, 상대 경로, WEB 경로 등)으로 설정할 수 있습니다.
debugInner.file: 임베디드 사용 모드 모드
showtime=true/false true: 각 디버그 메시지 전 현재 시간을 표시합니다.
false : 현재 시간을 표시하지 않고 디버그 정보만 표시합니다.
"showtime" 매개변수가 설정되지 않은 경우 기본값은 false입니다.
url 속성은 http://www.baidu.com과 같은 대상 페이지의 URL일 수 있습니다.
- url 매개변수가 설정되면 url이 가리키는 웹페이지의 innerHTML이 targetpage div에 추가됩니다


Step 3. 테스트 코드는 다음과 같습니다.








프로젝트 규모가 크면 항상 프로그램에 일부 디버깅 정보를 유지하고 필요할 때 디버깅해야 합니다.
따라서 언제든지 주요 정보를 출력할 수 있는 것도 중요하며, 동시에 릴리스 이후 대상 스크립트의 실행 성능에 영향이 없는지 확인하는 것도 고려해야 할 문제입니다.
이 도구에서 제공하는 인쇄 인터페이스는 다음과 같습니다: jslog(msg,color);//msg: 메시지 색상: 메시지 색상
작업 중에 대상 프로그램의 JS에 "2단계"를 추가하려는 경우 삭제를 해제하거나 임의의 이름으로 프로그램에서 메서드를 재구성할 수 있습니다. 예:
function out(msg,color){
if(jslog) jslog(msg,color)
} 🎜 >또한 자신이 정의한 메서드를 균일하게 사용할 수도 있습니다. 예를 들면 다음과 같습니다.
function test(){
out(null,"red");//null
out(1/3,"red" ); //숫자
out(1==2,"red");//boolean
out(test,"blue");//function
out("hello world!"," red" );//string
}

그러나 일반적으로 릴리스 시 디버그 스위치는 debug=false로 설정됩니다. 대상 프로그램에서 디버깅 코드를 삭제할 필요는 없습니다. 대상 JS 프로그램의 실행 성능에는 영향을 미치지 않습니다. Impact; 다시 디버그해야 하는 경우 디버그 스위치를

//--로 설정하면 됩니다. ---- -------------최신 다운로드---- --- ----//

다운로드(2007년 12월 23일 업데이트): http://www.box.net/shared /bc3s1hdkw0

//------ -------------이력 업데이트------ -------------------- -----//

2007/12/ 23 업데이트: (현재 15K)
1. jslog 통합 관리에서 내부 이벤트를 수행합니다. 내부 테스트 단계에서 "이벤트 등록 취소" 테스트를 위한 인터페이스가 남습니다. 콘솔을 두 번 클릭하여 호출할 수 있습니다. > 2. debugInner 페이지 레이아웃 조정, debugInner의 콘솔을 부동, 드래그 가능 및 너비 조정 가능하게 만들기 콘솔의 상단과 왼쪽 부분은 40 미만으로 드래그할 수 있습니다.
참고: 간단하고 실용적이기를 바라며, 부풀려지는 것을 좋아하지 않습니다. 이제부터 debugInner만 업데이트되고 debugPopup은 더 이상 업데이트되지 않습니다