Google フォーム内のラジオボタン、チェックボックス、プルダウンの選択肢を取得する JavaScript サンプルコードをご紹介します。

Google フォームの前提条件

本記事用に、Google フォームサンプル を作成しました。これを元に JavaScript スニペットと実行結果をご紹介します。

Google フォームの選択肢を取得する

Google フォーム内のラジオボタン、チェックボックス、プルダウンの選択肢を出力する JavaScript サンプルコードは以下の通りです。

var outputs = [];

var items = document.querySelectorAll('[data-item-id]');
[].forEach.call(items, function(item) {
  // 各質問のタイトルを表示する
  [].forEach.call(
    item.getElementsByClassName('exportItemTitle'),
    function(itemTitle) {
      outputs.push(itemTitle.textContent);
    }
  );

  // ラジオボタン / チェックボックスの選択肢を表示する
  [].forEach.call(
    item.getElementsByClassName('exportLabel'),
    function(label) {
      outputs.push(label.textContent);
    }
  );

  // プルダウンの選択肢を表示する
  [].forEach.call(
    item.getElementsByClassName("exportOption"),
    function(option) {
      outputs.push(option.textContent);
    }
  );
});

console.log(outputs.join('\
'));

JavaScript サンプルコード実行結果

Chrome Developer Tool コンソール で JavaScript を実行した出力結果が以下のスクリーンショットです。

以上、Google フォームの選択肢を JavaScript で取得したい現場からお送りしました。