配列オブジェクトの入れ子になっているループ文の中の変数に対して発生しているため、 for (var i = 0; i < Cnt; i++) { Object.values(変数[e][i]); } の時に、参照しているオブジェクトのkeyを降順の数値を指定した場合はOK。文字列やランダムな英数時などはエラーがでる。

iの指定方法が不正であったようで、 Object.values(変数[e][i])という記述に誤りがあったので、 Object.values(変数[e])[i]とすることでエラーが回避されました。

ありがちなのは関数の外の変数を参照しようとしていたり、変数名を変更した際に、前に定義していた変数名などが残っているケースがあるので、エラーの出る変数の名前もしくは宣言を修正することで解消されました。

BoostrapというCSSフレームワーク導入時には、標準でjQueryのスリムビルド版を読み込むようになっているようす。 信じられない話だが、JQueryでよく使う関数ベスト10(当社独自ランキング)のほとんどが使用できない。

• animate
• show
• hide
• delay
• fadeOut
• fadeIn
• fadeToggle
• fadeTo
• slideDown
• slideUp
• slideToggle

対処方法としては、通常の3.6.0.min.jsの正規版を読み込む記述にすることで回避できる。 他のJQueryプラグインなどある場合は、そこより下に読み込むとエラーになるので、スリムビルド版の記述を正規のJQueryに訂正した方がよいでしょう。

エラーメッセージの意味をGoogle翻訳すると、

エラー：onMessageリスナーからの約束された応答が範囲外になりました

background.jsという見覚えのないJavaScriptファイルがエラーの発生源となっています。 background.jsとはマイクロソフト社の名前があり、どうやらフリーウェアファイルのような記載もあります。 一説には拡張機能を動作時に読み込まれるファイルのようで、拡張機能(アドオン)動作と関係があるようでした。 当社の環境ではブラウザがFirefoxでアドオンGhostreyを起動させていると発生しました。 Ghosteryを停止するとエラーは発生しませんが、このbackground.jsファイルの特定環境でのエラーは実際のページ表示や機能には関与せず、特段気にする必要はない(自発的に修正できない)ようなブラウザ(OS)特有設定時でのエラーということになり、解決策としてはアドオンを非使用にすることですが、わりと利用価値のあるアドオンであるため、このエラーに関してはそのままスルー対応となりました。

エラーメッセージの意味をGoogle翻訳すると、

キャッチされないタイプエラー：functionNameは関数ではありません

結論から言えば、このエラーはほぼ関数が正しく宣言されていない場合か、jQueryがコンフリクト(衝突競合)している場合です。スライダー単体では動作するので、jQueryのコンフリクトが考えられます。 この場合は同じバージョンのjQueryで統一するか、エイリアスを使用することになります。複数のJavaScriptファイルが読み込まれている場合は、可能であれば同じバージョンのjQueryを使用することが最も手っ取り早いですが、複数のファイルが組み込まれている場合や特定バージョンでないと動作しない場合などはエイリアスで追加したスライダーの標準のjQuery($)ではなく、独自のエイリアスを宣言して回避しました。

エラーメッセージの意味をGoogle翻訳すると、

キャッチされない TypeError: target.offset() が未定義です

結論から言えば、このエラーはほぼ移動先のidがページ内に存在していないということで表示されるエラーとなります。 ですので、ページ内のアンカーリンク先のid属性を設置すればエラー表示は解決されるはずです。 設定しない場合はhref=”javascript:void(0)”ということで常にundefinedを返すことが可能ですが、aタグ内でもともとリンクを無効化する場合に使用する場合意味がないため、aタグ自体をpタグなどのブロック要素に変更することで根本的な解決が図ることができる。

エラーメッセージの意味は変数XXXが空であるとなっていて、

対象がundefined または nullの時

解決策自体はいたって簡単で、変数XXXにgetElementByIdで参照していたHTMLタグをページ内に配置することで解決しました。結論としてTypeErrorのis nullやis not definedはすべて参照している関数や変数などが正しく存在していないことから生じるエラーです。 ですので、読み込まれるはずの値を正しく設置または指定することでエラー表示は解決されます。

エラーメッセージの意味は変数＄(JQuery)が関数として定義されていません！というごくシンプルな内容です。

• 対象が関数として定義されていない時

asyncを削除してDOMに従って読込をさせることでエラー表示は解決されます。

またグローバルスコープJQueryやエイリアスで標準指定されている＄マークは、他のバージョンのJQueryとコンフリクト(競合)することで、同じエラーが表示されることがあります。
その場合は、以下のようにエイリアスを独自に指定することで、異なるバージョンのJQueryを共存させることができます。

任意のグローバル関数名 = jQuery.noConflict(true);

jQueryが複数バージョン使用されている場合のチェック記述

console.log($.fn.jquery); //$はどのjQueryバージョンが有効になっているか
console.log(jQuery.fn.jquery); //jQueryはどのjQueryバージョンが有効になっているか

エラーメッセージの意味は文法エラーでJQueryで認識できないセレクタが含まれているという内容です。

• 対象セレクタが認識されない書式または値である時

セレクタとして指定していた$(‘a[href=#anc-exc]’)がJQuery3では構文が変更されており、JQuery2で認識されていたセレクタが解釈できなくなったためのエラーです。

$(‘a[href=”#anc-exc”]’)と指定した関数内のセレクタをダブルコーテーションで囲うことでエラーがでなくなりました。

バージョン変更による影響

jQuery構文変更により以前エラー判定されていなかった記述がエラー判定されるケースは多いので注意が必要です。