intense.jsのエラー原因・解決方法

popです。
今回はプログラミングしている中で私がハマった点についてのメモです。


intense.js 112行目に発生するエラー

私がプログラミングをしている中で気になった点についてまとめてみます。

私は「intense.js」というものを使っている時のことです。


ある程度作成していたものの大枠ができたと思ったので、いつもと同じように「google chrome」のデベロッパーツールを使ってエラーが出ているか確認しました。
(私が普段使用するブラウザはgoogle chromeです。)

 

そうしたら

f:id:ayatakex:20180618231058p:plain

intense.jsのエラー




このようなエラーが発生していました。

行としてはこんな感じです。
(intense.js:112)
(intense.js:106)
(intense.js:404)

 

加えて、HTMLの該当箇所はこちらです。(コード直書きで申し訳ないです)

<script>
var elements = document.querySelectorAll('.demo-image');
Intense(elements);
</script>

 


表示された該当箇所のコードを見てみました。

すると


このように表示されていました。

 

f:id:ayatakex:20180618231303p:plain

intense.jsのエラー 詳細

function track(element) {
// Element needs a src at minumun.
if (element.getAttribute("data-image") || element.src || element.href) {
element.addEventListener(
"click",
function(e) {
if (element.tagName === "A") {
e.preventDefault();
}
if (!active) {
init(this);
}
},
false
);
}
}


さらに詳しく言えばUncaught TypeError: element.getAttribute is not a functionと表示されました。

 

 

解決方法
結局、HTMLのIntense(elements);という行をコメントアウトすることでエラーはなくなりました。
やり方としては少々強引ですが・・・

おそらく他により良いやり方があるのだろうと思います。

今後他の方法を見つけたら追記します。


(蛇足ですが、今回発生したエラーを放置しても実際に作成したプログラムの挙動には影響がなく、業務には支障がありませんでした。)


終わりに

今回は「intense.js」のエラーについて記述しました。


私自身intense.jsについての知識があまりないので、まずはintense.jsの理解から固めたほうが早いのかなぁと思っています。


なにかアドバイス等ありましたら教えて頂けるとありがたいです。

今後ともよろしくお願いいたします!