내 JavaScript 코드가 로컬에서는 작동하지만 JSfiddle.net에서는 작동하지 않는 이유는 무엇입니까?

JSfiddle.net에서 JavaScript가 실행되지 않음

문제:

제공된 코드가 라이브 사이트에서는 올바르게 작동하지만 실패합니다. JSfiddle.net에서 실행하면 "ReferenceError: fillList가 정의되지 않음" 및 "ReferenceError: mySelectList가 정의되지 않음"과 같은 콘솔 오류가 발생합니다.

설명:

주어진 코드에서 함수는 onload 함수 내에서 정의됩니다. 이를 통해 해당 함수 내에서 함수를 참조할 수는 있지만 전역적으로 액세스할 수는 없습니다. 결과적으로 전역 이름(예: fillList() 및 mySelectList)을 사용하여 HTML에서 이러한 함수를 참조하면 JSfiddle이 해당 함수를 인식할 수 없습니다.

해결책:

이 문제에 대한 세 가지 주요 해결책이 있습니다.

a) 함수 세계화:

<code class="javascript">window.fillList = function() {};
window.mySelectList = function() {};</code>

이 접근 방식은 함수를 전역으로 만들지만 환경을 오염시키기 때문에 이상적이지 않습니다. 전역 네임스페이스.

b) 눈에 띄지 않는 JavaScript 사용:

onload 함수 외부의 함수를 정의하고 JavaScript만 사용하여 이벤트 리스너 연결:

<code class="javascript">function fillList() {}
function mySelectList() {}

window.onload = function() {
  var e = document.getElementById('elementId');
  e.addEventListener('click', fillList);
};</code>

HTML과 JavaScript를 분리하는 것이 가장 좋습니다.

c) JSfiddle 설정 수정:

JSfiddle 설정을 "No Wrap(head or body)"로 변경하여 코드가 onload 함수에 래핑되는 것을 방지합니다. 이를 통해 기능에 전역적으로 액세스할 수 있습니다.

위 내용은 내 JavaScript 코드가 로컬에서는 작동하지만 JSfiddle.net에서는 작동하지 않는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!