URLにハッシュを付与して特定の位置までスクロールさせると、target.offset().topにエラーが出ます

前提・実現したいこと

https://www.AAAAA.com/BBB/ というページ内に、id="CCC" という要素があるとします。
https://www.AAAAA.com/BBB/ にアクセスした場合に、URLに「#CCC」を付与して、
その箇所まで自動的にスクロールする、、、というような、
ページ遷移後に特定の要素の位置までスクロールするコードをjQueryを利用して書きました。

ブラウザで確認すると、いつもではないのですが、たまにコンソールにエラーメッセージが表示されます。
しかし、動作には問題がないように思います。
エラーメッセージを出さないようにしたいのですが、どのように書き換えをしたらよいのか分からず、
ここにおたずねさせていただきました。ご教授いただけますと嬉しいですm(_ _)m

エラーメッセージ

Uncaught TypeError: target.offset is not a function at （JSのファイル名）
↑↑↑
「target.offset().top は、関数ではないよ」というエラーでしょうか…？？

該当のソースコード

jQuery
1$(function() {
2    var headH = $(".header").outerHeight();
3    var animeSpeed = 300;
4    var urlHash = location.hash;
5    if (!(urlHash)) {
6        location.hash = '#CCC';
7        $("body,html").scrollTop(0);
8        setTimeout(function () {
9            var target = '#CCC';
10            var position = target.offset().top - headH;
11            $("body,html").stop().animate({scrollTop: position}, animeSpeed);
12        }, 300);
13    }
14});

###試したこと
読み込みのタイミングが悪いのか？と思いましたが、特に変化はなかったです。
そもそものエラーをあまりよく理解できずにおり、どのように試したらよいのか分かりませんでした。

補足情報（FW/ツールのバージョンなど）

jQueryは、3系を使用しています。

行動規範の内容に同意します

回答2件

ベストアンサー

js
1var target = '#CCC';
2var position = target.offset().top - headH;

上記部分でtargetは文字列です。（毎回エラーが出ないとおかしい気がしますが）

js
1var target = $('#CCC'); // こうでは？
2var position = target.offset().top - headH;

投稿2021/07/22 02:58

kei344

総合スコア69400

miw_arock

2021/07/22 10:33

kei344さん、回答ありがとうございました。ご指摘いただいて「あ！！！」となりました。確かにです・・・仰るとおりですm(_ _)m var target = '#CCC';　では、targetは文字列です・・・（恥）たまに触るくらいだと大事な基礎の部分が抜けてしまい、お恥ずかしいかぎりです。気づけてよかったです。ありがとうございました！

行動規範の内容に同意します

kei344さんにご指摘いただき、こうなりました。

jQuery
1$(function() {
2    var headH = $(".header").outerHeight() + 30;
3    var animeSpeed = 300;
4    var urlHash = location.hash;
5    if (!(urlHash)) {
6        location.hash = '#CCC';
7        $("body,html").scrollTop(0);
8        setTimeout(function () {
9            var target = $('#CCC');
10            var position = target.offset().top - headH;
11            $("body,html").stop().animate({scrollTop: position}, animeSpeed);
12        }, 300);
13        console.log(headH);
14    }
15});