このようにテキストボックスを3つ作成するコードの例です
コード.gs
function doGet(){
return HtmlService.createHtmlOutputFromFile('index');
}
|
意訳この処理は以下を実行する 指定したHTMLファイルを表示する |
index.html
<!DOCTYPE html>
<html>
<body>
<div id="main_div">
</div>
</body>
<script>
create_textbox();
function create_textbox() {
var main = document.getElementById('main_div');
for (var i = 0; i < 3; i++) {
var elem = document.createElement('input');
var id = "tb" + i;
elem.setAttribute("type", "text");
elem.setAttribute("placeholder", "tb" + i);
elem.setAttribute("id", id);
main_div.appendChild(elem);
}
}
</script>
</html>
|
意訳これはHTML5文書です divを置く（idはmain_div) create_tb()を実行する この機能がやること idがmain_divの要素を取得して 以下を３回繰り返す input要素を作成して idを決めて typeをtextにして placeholderを設定して→入力欄に表示しておく文字 idを設定して main_divにボタンを追加する |
index.htmlにある
for (var i = 0; i < 3; i++) {
の 3 を別の数値変えると作成されるテキストボックスの数が変わります
関連記事
ウェブアプリケーションとして導入する方法がわからない場合
↓この記事にまとめました
Google Apps ScriptのWebアプリ雛形
参考
HTML Service: Create and Serve HTML
https://developers.google.com/apps-script/guides/html/
