jquery

www.w3schools.com

$(function() {
 $("button").click(function(){
    $("p").hide();
  });
});

のように$('hoge)で要素を指定

.clickでイベント指定

$('p')で要素を指定

.hideで実行を指定

する

mouseenter() ，mouseleave()，などもある

$("p").on("click", function(){

でonを使ってもclickを組める

hideとshowとtoggleで隠せる

$("#btn1").click(function(){
  alert("Text: " + $("#test").text());
});

とid指定でbtn clickで発火せるのが簡単

$("div").text();　で中身を観れる

add html

jQuery Set Content and Attributes

$("#btn1").click(function(){
  $("#test1").text(function(i, origText){
    return "Old text: " + origText + " New text: Hello world!
    (index: " + i + ")";
  });
});

のようにidのtextにreturn で返すことで中身を追加できる

original text の中身がどんどん増えていく

でもこれだと見た目のHTML 要素に追加することはできてもfirebaseに変数を 介して追加することはできないし，画面の更新もできない

sql injection

firebaseのfirestoreからdataを持ってきてappened()でhtmlに 追加したらxvideosが開くリンクを入れられてしまったw

scriptを防ぐためにはhtmlEscape(), h()が一般的だがjsでは存在しない．

なのでcreateTextNode()で防げる？

stackoverflow.com

防げたけど何も出ない

こちらの回答にある関数定義を使ってみる