데이터 특정값에 따른 CSS 자동 변경

[LDK]

안녕하세요,  id = '각도' 데이터는 웹카메라를 통해 실시간 받고 있는데요. 이 값이 150도를 넘으면 해당 각도 텍스트 컬러를 바꾸려고 합니다. 이벤트함수를 mouseover로 해보니, if 조건에 해당하는 순간에 마우스를 올릴 때 바뀌는 것은 확인 했습니다. 원하는 것은 실시간 데이터에 따라 자동으로 컬러가 바뀌도록 하고 싶은데, 검색으로 찾아봐도 잘되지 않습니다.  어떤 부분이 문제가 될까요? 감사합니다.

====

[웹카메라의 영상을  계산한 각도 데이터를 실시간으로 html에 보여줌]

document.getElementById("각도").innerText =  계산한 실시간 각도 데이터

 

[html에서의 스크립트]

<script>

$('#각도').change(function(){
var data = $(this);
var value = parseInt(data.text());
if(value >= 150){
data.css("color","red");
}else{
data.css("color","white");
}
});

</script>

[codingapple]

change 이벤트는 <input>의 value 속성이 변할 때 동작합니다

각도데이터를 <input value=""> 안에 몰래 넣어놓고 이벤트리스너 걸면 잘될수도요

[LDK]

 감사합니다. 가르쳐 주신대로 히든 인풋필드 만들고, 인터벌함수로 마무리하니까 잘 됩니다. 그런데 선생님이 기대하신 방법이 맞는지요? 감사합니다.

setInterval(() => {updateValue($('#히든각도).val());

[codingapple]

setInterval은 값변경시 실행되는게 아니라 그냥 주기적으로 실행되겠지만 잘되면 상관없을듯요 

[LDK]

아, 인터벌함수 없이 해봐야겠네요. 감사합니다.

[글쓴이]

글