javascript jquery をvanila jsに書き換えたい

javascript

document.addEventListener('change', function (e) { var _document$querySelect; var v = (_document$querySelect = document.querySelector('[name="boundSelect"]:checked')) === null || _document$querySelect === void 0 ? void 0 : _document$querySelect.value; box_out.style.display = v == "out" ? "block" : "none"; box_in.style.display = v == "in" ? "block" : "none"; if (v === "out") { $('#inputDate').val($('#dateSelector_out').val()); } else if (v === "in") { $('#inputDate').val($('#dateSelector_in').val()); } });

上記のように、バニラJSにjqueryが混ざっているコードを書いてしまい、以下のようにバニラJSに統一しようとしているのですが、

javascript

document.addEventListener('change', function (e) { var inputDate = document.getElementById('inputDate'); var dateSelector_out = document.getElementById('dateSelector_out'); var dateSelector_in = document.getElementById('dateSelector_in'); var _document$querySelect; var v = (_document$querySelect = document.querySelector('[name="boundSelect"]:checked')) === null || _document$querySelect === void 0 ? void 0 : _document$querySelect.value; box_out.style.display = v == "out" ? "block" : "none"; box_in.style.display = v == "in" ? "block" : "none"; if (v === "out") { inputDate.val(dateSelector_out.val()); } else if (v === "in") { inputDate.val(dateSelector_in.val()); } });

現状は、コンソールから「scripts.js:627 Uncaught TypeError: dateSelector_in.val is not a function」と出てきます。

最終的には三項演算子に統一したいのですが、if elseの書き方に慣れているため、jqueryだった箇所をif else のままにしています。これも統一しないとな。。。。

jsほぼ初心者のためどう書き換えていいのかわかりません。
アドバイスお願いします。

コメントを投稿

0 コメント