如何在 HTML 的不同文件中使用 JavaScript 類並且仍然可以在 IOS 上工作？

Question

我目前處於需要在不同的 js 文件中使用 JavaScript 中的類的情況。 在這種情況下，我在文件js/radar-home.js中有一個名為Panel的 class 。 這就是我目前在 HTML 文件中使用 class 的方式：

<script src="{{ asset('js/radar-home.js') }}"></script>
<script>
        try{
            var panel1 = new Panel(args);
        catch(err){
            alert("Internal Error - " + err);
        }
</script>

此方法在 Windows 和 Android 上運行良好。 它也適用於我測試過的所有瀏覽器，包括 Chrome。 但是，當在我的 iPhone 上加載此文件或在 Safari、Chrome、Firefox 和 WebDebugfrence 應用程序上加載 iPad 和 WebDebugfrence 應用程序時，我收到一條帶有消息的警報： Internal Error - RefrenceError: Can't find variable: Panel 。

我的環境：

• PHP 7.3.21
• Laravel 6.18.25
• 在 Ubuntu 20.04 服務器上
• 源在 ios 和 windows 瀏覽器上看起來相同。
• CloudFlare（代理）- 但是，在我設置它之前，我仍然遇到完全相同的問題，以及當我使用 HTTP 而不是 HTTPS 時。

任何幫助深表感謝。

編輯：我在radar-home.js中放置了一個function，沒有被class包裹。 這個 function 在桌面上運行沒有錯誤，但在 IOS 上出錯。 Output： RefrenceError Can't find variable: testing123 （ testing123()是我做的測試 function）。

Answer 1

當 DOM 准備好時，您需要執行代碼。 代碼在radar-home.js 加載到頁面之前執行。 嘗試類似：

    <script src="{{ asset('js/radar-home.js') }}"></script>
    <script>
      if(document.readyState === "loading") document.addEventListener('DOMContentLoaded', func); else func();
    
      function func(){
          try{
                var panel1 = new Panel(args);
            } catch(err){
                alert("Internal Error - " + err);
            }
      }
    </script>

Answer 2

所以看起來這個問題的解決方案是我可能應該早點調查的。 此問題僅發生在 IOS 設備上。

本質上，由於 IOS 無法正確解析的語法錯誤或雜項錯誤，腳本無法加載。 與Chrome、Firefox等眾多瀏覽器竭盡全力閱讀JavaScript不同，IOS非常挑剔。

在使用JavaScript 驗證器（除了 ES6 錯誤）修復了所有錯誤之后，IOS 上的一切工作都完美無缺。