Почему код JavaScript не работает на jsfiddle.net

В предоставленном коде обнаруживается проблема при попытке запуска на jsfiddle.net с записью в консоли «ReferenceError: Function Name» не определено». Чтобы понять это, мы углубимся в структуру кода и проанализируем его выполнение внутри jsfiddle.

В коде определяются такие функции, как BetterSelect и fillList внутри функции с именем window.onload. В типичной веб-среде эта функция гарантирует выполнение кода после загрузки окна. Однако в рамках jsfiddle этот аспект вносит решающее различие.

Когда код выполняется на действующем сайте, функции доступны глобально внутри объекта окна, поскольку они определены вне какой-либо конкретной области функций. Однако в jsfiddle функции доступны только в пределах области действия функции window.onload.

Существует несколько решений этой проблемы:

1. Глобальное определение функций : Измените объявления функций на window.functionName = function(){};.
2. Ненавязчивый JavaScript: отделите HTML от JS, чтобы прикрепить поведение к элементам DOM только через JS.
3. Отключить обтекание jsfiddle по умолчанию: выберите «Без переноса» ( body или head) вместо «onLoad».

Решая эту проблему, вы можете гарантировать, что что ваш код JavaScript корректно выполняется как на действующих сайтах, так и на jsfiddle.net.