Bye Bye Moore

PoCソルジャーな零細事業主が作業メモを残すブログ

jQueryでDOMの内容を更新したりよんだりする

javascriptが分からな過ぎて、多分またググるので自分用にメモを残して置く。

実際のところ

<html>
<head>
<title>Hello World</title>
</head>
<body>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

<p id="sample">Hello World!</p>

<button id="btnA" >Push Me</button>


<script type="text/javascript">
  const btnA = document.getElementById("btnA");
  btnA.addEventListener("click", func = () => {
    document.getElementById("sample").textContent = "FOOBAR"
  });
</script>

</body>
結果

普段はこうだが
f:id:shuzo_kino:20220126201347p:plain
ボタンを押すと変わる
f:id:shuzo_kino:20220126201414p:plain

変数をもたせる

変数の結果を格納もできる

let value
const btnA = document.getElementById("btnA");
btnA.addEventListener("click", func = () => {

document.getElementById("sample").textContent = "value::" + value;

});
結果

3回押した結果がこちら
f:id:shuzo_kino:20220126201544p:plain