こういう機能を作る
ボタンをクリックすると 対象の要素 の表示状態(class名)が変わる
対象の要素
コード.gsfunction doGet() {
return HtmlService.createHtmlOutputFromFile("index");
}
| 意訳この機能がやること 指定したHTMLファイルを表示する |
index.html<!DOCTYPE html>
<html>
<style>
.visibility_visible {
visibility: visible;
}
.visibility_hidden {
visibility: hidden;
}
</style>
<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.className = "visible";
}
function bt_hidden_clicked() {
div.className = "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のクラス名をvisibleにする この機能がやること idがdiv1のクラス名をhiddenにする |
