こういう機能を作る
ボタンをクリックすると 対象の要素 の表示状態(class名)が変わる
対象の要素
コード.gsfunction doGet() {
return HtmlService.createHtmlOutputFromFile("index");
}
| 意訳この機能がやること 指定したHTMLファイルを表示する |
index.html<!DOCTYPE html>
<html>
<body>
<div id="div1">対象の要素</div>
<button id="bt_visible">visible 見える</button>
<button id="bt_hidden">hidden 見えない</button>
<script>
document.getElementById("bt_visible").onclick = bt_visible_clicked;
document.getElementById("bt_hidden").onclick = bt_hidden_clicked;
var div = document.getElementById("div1");
function bt_visible_clicked() {
div.style.visibility = "visible";
}
function bt_hidden_clicked() {
div.style.visibility = "hidden";
}
</script>
</body>
</html>
| 意訳これはHTML5文書です divを置く ボタンを置く(id は bt_visible) ボタンを置く(id は bt_hidden) idがbt_visibleの要素をクリックしたらbt_visible_clickedを実行する idがbt_hiddenの要素をクリックしたらbt_hidden_clickedを実行する idがdiv1の要素を取得する この機能がやること idがdiv1のstyleのvisibilityをvisibleにする この機能がやること idがdiv1のstyleのvisibilityをhiddenにする |