queryselctorのセレクタの後ろについている?の意味

下記コードの様にセレクタの後ろに？がついているのはどういう意味でしょうか？
宜しくお願い致します。

Javascript：
document.querySelector('[data-target="1"]')?.setAttribute('data-target',0);

CSS：
[data-size="1"]{font-size:50%;}
[data-size="2"]{font-size:75%;}
[data-size="3"]{font-size:100%;}
[data-size="4"]{font-size:125%;}
[data-size="5"]{font-size:150%;}

No.1 回答者： Ogre7077 回答日時： 2021/03/18 17:42

オプショナルチェイニング演算子 "?." ですね。

https://developer.mozilla.org/ja/docs/Web/JavaSc …

左側の値が存在しない(null または undefined)場合に、
右側のプロパティ記述やメソッド記述を無視してくれます。

ご提示の場合ですと、以下の処理とほぼ同じ意味となります。

// x は HTMLElement オブジェクト、または null が入る
let x = document.querySelector('[data-target="1"]');
// x がオブジェクトなら処理し、null なら何もしない
if (x) { x.setAttribute('data-target', 0); }

No.2 回答者： yambejp 回答日時： 2021/03/18 21:53

teratailからの転載ですか？

https://teratail.com/questions/328153

なにも技術系の質問板から、こんな雑多なところに持ち出すほどの
質問でもないでしょうに・・・
ちなみにその処理はターゲットになるtextareaにdata-target=1を
していすることでアクティブなtextareaを特定しています
data-sizeについてはサイズを変えたいという希望があったので
クラスでもよかったんですがより直感的なカスタムデータで
指定しています

この回答へのお礼

回答ありがとうございます。
terailでも質問しようか迷ったのですが、質問を立て続けに行うと本来の教えてもらいたい内容と混在してしまい、回答者様にも迷惑をかけると思ってこちらに質問しました。
今は教えて頂いた内容を理解しようと苦戦しており、様々ご迷惑をおかけします。
重ね重ねがりがとうございます。

お礼日時：2021/03/19 09:19