카테고리 없음
Target container is not a DOM element
딸기뚜왈기
2024. 6. 17. 16:41
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<button id="Aplayer" onclick="increase()">0</button>
<button id="Bplayer" onclick="increase()">0</button>
<script>
var count=0
function increase(){
count=count+1;
document.querySelector("#countBtn").innerText=count;
}
</script>
</body>
</html>
Board2.js (오답)
return (
<>
<div>
<div>
{board}
</div>
<div className='Cat-button'>
<br></br>
<button id="AcountBtn">APlayers</button>
</div>
</div>
</>
);
}
}
export default Board2;
Dom에 렌더링시 render하고자 하는 Element를 찾을 수 없어서 발생.
--> 해결 : js 파일에서 가져오고자 하는 element 의 id 와 렌더링 될 element 의 id 를 맞춰주면 된다.
id 수정:
<button id="AcountBtn">APlayers</button>
====>>>
<button id="countBtn ">APlayers</button>
return (
<>
<div>
<div>
{board}
</div>
<div className='Cat-button'>
<br></br>
<button id="countBtn ">APlayers</button>
</div>
</div>
</>
);
}
}
export default Board2;