jsfiddle.net에서 JavaScript 코드가 실패하는 이유

제공된 코드는 jsfiddle.net에서 실행을 시도할 때 콘솔 로깅과 함께 문제를 나타냅니다. "ReferenceError: 함수 이름 정의되지 않았습니다." 이를 이해하기 위해 코드 구조를 자세히 살펴보고 jsfiddle 내에서 실행을 분석합니다.

코드는 BetterSelect 및 fillList와 같은 함수를 다음과 같은 함수 내에서 정의합니다. window.onload. 일반적인 웹 환경에서 이 기능은 창이 로드되면 코드가 실행되도록 합니다. 그러나 jsfiddle의 프레임워크 내에서 이 측면은 중요한 차이점을 가져옵니다.

코드가 라이브 사이트에서 실행될 때 함수는 특정 함수 범위 외부에서 정의되기 때문에 창 개체 내에서 전역적으로 사용할 수 있습니다. 그러나 jsfiddle에서는 window.onload 함수 범위 내에서만 함수에 액세스할 수 있습니다.

이 문제에 대한 해결 방법은 여러 가지가 있습니다.

1. 전역적으로 함수 정의 : 함수 선언을 window.functionName = function(){};.
2. 로 변경합니다. 눈에 거슬리지 않는 JavaScript: JS를 통해서만 동작을 DOM 요소에 첨부하기 위해 JS에서 HTML을 분리합니다.
3. jsfiddle의 기본 래핑 비활성화: "onLoad" 대신 "No Wrap"(본문 또는 헤드)을 선택합니다.

이 범위 지정 문제를 해결하면 JavaScript 코드가 두 라이브 사이트 모두에서 올바르게 실행되도록 할 수 있습니다. 그리고 jsfiddle.net.