近況

痾痾痾啊啊啊，同學已經開始新工作，我還繼續卡在 12 週 （這好像是過不去的門檻嗎每次心得都要提一次＝＝）
最近履歷準備好了，整理幾個小作品決定先出去面試新天地

然後我今天看自己之前寫的 12 週作業一，覺得需要自己重新寫過一遍，重新理解一遍會比較好。
目前就是中午午休時間看 React ，回家看 JavaScript ， 上班切版之餘偷偷練一下寫 code 能力跟概念。
學到的就是反覆看 React 基礎，終於看出個大概了ＱＱ
有點像是本來摸著拼圖，終於看出一點樣子的感覺。

星期二上班寫了一個類似最近很夯的韓國顏色測驗遊戲，就是點了答案判斷下一個題目，用 JavaScript 寫竟然寫到下午三點才寫出來...應該說還好有寫出來了ＸＤ
噴了 radio 抓值 null 的錯誤卻不知道怎麼解，就改成抓 input id 的地方

這是一個被技術主管看到會被殺掉的程式碼ＸＤ
知道可以優化卻不知道要怎麼優化的狀態，目前自己就是卡在這種不上不下的狀態，唉呀呀

<div class=\"solutions_form\" id=\"solutions_form\">
        <div class=\"solutions\" id=\"sol01_div\" name=\"sol01_div\">
          <div class=\"solutions_text\">
            <div class=\"solutions_no\">1</div>
            <div class=\"solutions_title\">
              題目一
              <div class=\"select\">
                <label><input id=\"sol01\" name=\"sol01\" type=\"radio\" value=\"1\">是</label>
                <label><input id=\"sol01a\" name=\"sol01\" type=\"radio\" value=\"0\">否</label>
              </div>
            </div>
          </div>

        </div>
        <div class=\"solutions dis-none\" id=\"sol02_div\" name=\"sol02_div\">
          <div class=\"solutions_text\">
            <div class=\"solutions_no\">2</div>
            <div class=\"solutions_title\">
              題目二
              <div class=\"select\">
                <label><input id=\"sol02\" name=\"sol02\" type=\"radio\" value=\"1\">是</label>
                <label><input id=\"sol02a\" name=\"sol02\" type=\"radio\" value=\"0\">否</label>
              </div>
            </div>
          </div>
.
.
.
</div>

    // val=1, yes, no
    checkAns(\"#sol01\", \"#sol02\", \"#sol03\");
    checkAns(\"#sol02\", \"#sol03\", \"#sol05\");
    checkAns(\"#sol03\", \"#sol04\", \"#sol10\");
    checkAns(\"#sol04\", \"#sol05\", \"#sol05\");
    checkAns(\"#sol05\", \"#sol07\", \"#sol06\");
    checkAns(\"#sol06\", \"#sol07\", \"#sol11\");
    checkAns(\"#sol07\", \"#sol11\", \"#sol11\");

    // val=1, val=0, no, yes
    checkNOAns(\"#sol01\", \"#sol01a\", \"#sol03\", \"#sol02\");
    checkNOAns(\"#sol02\", \"#sol02a\", \"#sol05\", \"#sol03\");
    checkNOAns(\"#sol03\", \"#sol03a\", \"#sol10\", \"#sol04\");
    checkNOAns(\"#sol04\", \"#sol04a\", \"#sol05\", \"#sol05\");
    checkNOAns(\"#sol05\", \"#sol05a\", \"#sol06\", \"#sol07\");
    checkNOAns(\"#sol06\", \"#sol06a\", \"#sol11\", \"#sol07\");
    checkNOAns(\"#sol07\", \"#sol07a\", \"#sol11\", \"#sol11\");

    function checkAns(a, b, c) {
      document.querySelector(a).addEventListener('click', function (e) {
        if (e.target.closest(a).value === \"1\") {
          e.stopPropagation();
          document.querySelector(b + '_div').classList.remove('dis-none');
          e.target.closest(a + '_div').classList.add('dis-none');
          return
        } else {
          e.stopPropagation();
          document.querySelector(c + '_div').classList.remove('dis-none');
          e.target.closest(a + '_div').classList.add('dis-none');
          return
        }
      });
    }

    function checkNOAns(a, a1, b, c) {
      document.querySelector(a1).addEventListener('click', function (e) {
        if (e.target.closest(a1).value === \"0\") {
          e.stopPropagation();
          document.querySelector(b + '_div').classList.remove('dis-none');
          e.target.closest(a + '_div').classList.add('dis-none');
          return
        } else {
          e.stopPropagation();
          document.querySelector(c + '_div').classList.remove('dis-none');
          e.target.closest(a + '_div').classList.add('dis-none');
          return
        }
      });
    }