728x90
<body>
<div id="container" class="con-min-width">
<div id="con">
<div id="namecon">
<div id="name">To-do-list</div>
</div>
<div id="intext">
<input type="text" id="text" onkeyup="enterKey()" placeholder="할일을 입력해주세요">
<button id="sub">입력완료</button>
</div>
<div id="mcon">
<ul id="memo">
</ul>
</div>
</div>
</div>
</body> <script>
const text=document.getElementById('text');
let sub=document.getElementById('sub');
const memo=document.getElementById('memo');
sub.onclick= save;
let li;
let i=0;
function save(){
let text1=text.value;
if(text1==''){
alert("공부안하냐!?");
}else{
li=document.createElement('li');
li.textContent=text1;
li.id='list'+i;
memo.appendChild(li);
text.value='';
i++;
}
for(let k=0;k<=i;k++){
let list=document.querySelectorAll('li')[k];
list.onclick=function () {
list.parentElement.removeChild(list);}
}
}
function enterKey(){
if(window.event.keyCode==13){
save();
}
}
</script>작동은 되지만 오류뜸
오류: Cannot set properties of undefined (setting 'onclick')
즉 list의 값이 없다는 뜻인거같음..왜??
----> li값들을 넣은 후 삭제했을때 삭제한 li들을 찾는 것같음
그래서
for위로 list를 옮기고 [k]를 for 문안으로 옮김 + for 문조건문 안에 있는 i또한 list.length로 바꾸기
그럼 해결완료...
그래도 해결안되는점이...
document.queryselectorall을 elementsbytagname?으로 바꿨을때 겁나 이상하게 됨.. 왜인지 모르겠음이건...
'오류 처리' 카테고리의 다른 글
| 자바스크립트 호출순서?(제이쿼리) (0) | 2023.03.01 |
|---|---|
| remove child 오류 (0) | 2023.02.23 |
| form안에 button을 생성 후 onclick했지만 안됨 (0) | 2023.02.23 |