document.getElementsByName（）の属性名の前方一致指定

Question

前提・実現したいこと

HTMLでname属性が「checkbox_(番号)(※)」のチェックボックスを複数を作成しました。
JavaScriptのdocument.getElementsByName(属性名)にて。
name属性の名前が前方一致である場合の要素取得方法を知りたいです。

※例：checkbox_1、checkbox_2、checkbox_10のように指定

発生している問題・エラーメッセージ

前方一致の正規表現を使用し要素を取得しようとしましたが、
取得できず、配列の長さがゼロです。

該当のソースコード

var check_array=document.getElementsByName("^checkbox_");
alert(check_array.length);

試したこと

name属性の指定の仕方を以下で試してみました。
①．②では要素を取得できず、③では完全一致のため要素を取得できました。
①"^checkbox_"
②"/^checkbox_/"
③"checkbox_1"

Answer 1

こっちを使いましょう。

【document.querySelector - Web API インターフェイス | MDN】
https://developer.mozilla.org/ja/docs/Web/API/Document/querySelector

Comments

[Tiroze]

回答ありがとうございます。
以下のように変更しましたが要素を取得することができず、
「undefined」となってしまいました。
間違えている箇所がありましたら教えて頂けますでしょうか。

var　check_array
=document.querySelector("input[name^='checkbox_']");

[kei344]

var　check_arrayのスペースが全角ですよ。
https://jsfiddle.net/4r1popgs/

（複数取得したいなら下記）
【element.querySelectorAll - Web API インターフェイス | MDN】
https://developer.mozilla.org/ja/docs/Web/API/Element/querySelectorAll

[Tiroze]

回答ありがとうございます。
スペースが全角な件は、貼り付けする際のミスです。申し訳ありません。

複数取得のため、以下の記載の仕方で解決しました。
var check_array=document.body.querySelectorAll("input[name^='checkbox_']");