Apps Scriptリファレンス: Apps Script Reference |障害・課題追跡: IssueTracker |Google Workspace: Status Dashboard - Summary

2018年2月25日日曜日

JavaScriptで指定した要素の親要素を取得する


指定した要素の親要素を取得するコードの例です


コード.gsを実行すると

#document/html/body/div/p/textarea

のようにアラート表示されます



コード.gs
function doGet() {
  return HtmlService.createHtmlOutputFromFile("index");
}
意訳
この機能がやること
指定したHTMLファイルを表示する




index.html
<!DOCTYPE html>
<html>
  <body>
    <div>
      <p>
        <textarea id="ta">hello</textarea>
        <button id="bt">button</button>
      </p>
    </div>
    <script>
document.getElementById("bt").onclick = get_path;

function get_path() {
  var node = document.getElementById("ta");
  var result = node.nodeName;
  for(var i = 0; node.parentNode; i++){
    result = node.parentNode.nodeName + "/" + result;
    node = node.parentNode;
    }
    alert([result.toLowerCase(), i]);
}
    </script>
  </body>
</html>
意訳
 


div要素
p要素
テキストエリア
ボタン



idがbtの要素がクリックされたらget_pathを実行する

この機能がやること
idがtaの要素を取得して
そのnode名を取得して
そのnodeの親要素がある限り以下を繰り返す
親要素のnode名/node名
nodeにnodeの親要素を入れる

resultを小文字にしてiの値もログに出す






Latest post

Google Formsで記述式の質問に字数制限を設定したい

記述式の質問には「回答の検証」を設定することができます フォームの編集画面 右下の︙メニューで「回答の検証」を選択します 検証方法には「数値」「テキスト」「長さ」「正規表現」という種類があります 今回は字数制限したいので「長さ」を選びます 長さには「最大文字数」か「最小文字数」を...