(むさんあん) - 思考が無く - 躰が無く - 心が無く

トキメキ団塊親父のセカンド・ステージ - 退職爺のボケ封じ

jQueryの多重読み込み

久しぶりに「JQuery」に目が向いた。JQueryJavaScriptのライブラリである。
WikiPediaによれば最新版のV3.6.0が2021年3月12日に公開されている。毎年の春頃には新版が公開れている様子なので、そろそろ出ないものかと期待している。

このブログのテンプレート[ct_responsive3c]では、配布版ではJQuery①v3.5.1の使用を宣言しているが、俺はlivedoorブログ共々②v3.6.0に変更している。
  1. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  2. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
俺が利用しているlivedoorブログでJavaScript(JQuery)を利用しているのは「上下スクロールボタン」である。他で利用しているのはプラグインであり、それぞれが独自に組み込んでいる模様で前記のJQueryの利用宣言スクリプトは不要である。
なお、ネット検索ではJQueryを使わない「上下スクロールボタン」の設置方法が解説されている。
過去記事:JQueryをUpdate / HTML独習サンプル / 関連記事リストを表示 / livedoorブログのjQuery / 上に戻る・下に進むボタン / コメント欄の表示変更 / 「ページのトップに戻る」ボタン設置 / FC2ブログに引越し再考
このテンプレート[ct_responsive3c]でも「上下スクロールボタン」が設置されているが、俺的にはJQueryの利用目的は理解していない。

そんな状況の中で、「jQueryの多重読み込み」なる記事を発見した。

利用するプラグインごとに異なるバージョンのjQueryの呼び出しを記載している  導入時期や、プラグインの仕様によって、依存するjQueryのバージョンが異なるため、複数のバージョンのjQueryを利用せざるを得ないような場合で、一番対応が難しいケースです。
「WEXAL」を使ってみよう

前述のとおり本ブログでは、JQuery v3.6.0の使用を宣言している。しかし、複数利用している各々のプラグインが利用している版が判らない。したがって、「jQueryの多重読み込み」をしている事は間違いないだろう。これについて以前より気掛かりであったが、この際だから調べたい。

各サイトごとに利用している「jQueryの版」は以下により知ることができる。
ならば、複数利用している各々のプラグインが利用している版を調べるために、プラグインを個別に利用している環境で上記の「jQueryの版」をチェックすれば判るのではなかろうかと考えた。他に方法を思いつかないから、原始的かもしれないが...
20220225083300

なお、FC2ブログで共有として提供されているプラグインでは2012年以前の物が多い(2012年のjQueryは2012年8月9日のv1.8)。最近のプラグインでは「javascriptを使わずに作った」物が1つ(開閉式カテゴリ一覧)ある。
❓<script type="text/javascript">
  • JavaScript の古い書き方 - とほほのWWW入門
    2014年に勧告された HTML5 では、type 属性も Content-Script-Type の指定も不要となり、指定しない場合は規定値として JavaScript が実行されることになりました。現在では、language 属性も、type 属性も、Content-Script-Type の記述も不要です。
  • HTML5に関して いらないtype属性は消す - megmin’s blog
    HTML5 では、script 要素、style 要素に対する、type 属性は不要。
    script 要素 の場合、type 属性のデフォルト値として 「text/javascript」 が、style 要素の場合は 「text/css」 がセットされる。下記のようなソースは、
        <!-- これは間違った例 -->
        <link type="text/css" rel="stylesheet" href="css/styles.css" />
        <script type="text/javascript" href="js/scripts" /></script>
    下記のように書くことができる。
        <link rel="stylesheet" href="css/styles.css" />
        <script href="js/scripts" /></script>

<script type="text/javascript">記述のある、利用中のブラグイン

カテゴリ ※jQueryを使っていない「開閉式カテゴリ一覧」に変更した
カレンダ ※HTML5に改造した
最新コメント+TB ※HTML5に改造した
検索+タグクラウド ※HTML5に改造した
ブログ内 検索 ※HTML5に改造した
名言黒板 ※HTML5に改造した
ことわざ ※HTML5に改造した
22/03/11、その他の全てをHTML5に改造した..つもり

関連記事:アクセス解析用タグ改変 / jQueryの多重読み込み

YouTubeの埋め込みを高速化する Lite YouTube Embed - *Essence
報告します。

>FC2アクセス解析用HTMLタグのその書式は構文エラーなんですよ | Webテク倉庫
https://oops0011.blog.fc2.com/blog-entry-608.html

にヒントを得まして、利用しているプラグインでのjQueryに関するHTML記述をHTML5見合いに変更作業をしました。(https://nono634.blog.fc2.com/blog-entry-6004.html)
そして、その改変記録を自ブログ内に記録しようとして書きましたところ、1部のプラグインで不具合が発生する事が判りました。
恐縮ですがそのプラグインは、「Comments+Trackback」(https://admin.blog.fc2.com/control.php?mode=plugin&process=download&no=31111&mob=)です。

色々と弄った結果、「記録しようとしたjQueryに関する書き込み」と、「プラグイン内部でのjQueryに関する書き込み」内容が重複している為に発生した不具合ではないかと推測しました。したがって、「記録しようとしたjQueryに関する書き込み」記事を除去すれば不具合は発生しません。また、同じような作業をした中では「Comments+Trackback」以外は本件不具合は発生していません。
----------------------------------------------------
ということで、本件はそんなものかしらん...と思う事にしましたが、「wash_ashore」「Generic」などでは不具合が発生しない事がわかりました。ちなみに、「home_resp3c」「sunny_resp2c-r」でも同様の不具合でした。
正常な表示
https://f.hatena.ne.jp/nonn888/20220309110249
不具合な表示
https://f.hatena.ne.jp/nonn888/20220309110247
「wash_ashore」での表示
https://f.hatena.ne.jp/nonn888/20220309110245
----------------------------------------------------
その後弄ってみた結果、本件はjQueryに関する事が原因ではなく、「Comments+Trackback」に記述されたFC2ブログのタグのいずれかがトリガーになっているのだろうと踏んでいます。

以上、報告します。
関連記事
[Tag] * FC2 * HP作成 * livedoor
最終更新日時 :

コメント





非公開コメント

トラックバック