http://cafe.naver.com/q69/114498

해당 Object에 적용된 css 의 클래스를 조건에따라 변동시켜야 할 경우


 


JavaScript에서 접근할수 있는 프로퍼티는 CSS의 class의 경우 class가 아니라. className 이다


 


아래와 같은 방법으로도 접근이 가능하다.


object.setAttribute("className", "CSS_ClassName");


 


또 다른 클래스를 적용하지 않고 직접 CSS를 서술할경우에는


 


object.style.cssText='color: #FD0505;'; 와 같은 방법도 가능하다.


 


<html>
<head>
 <title>Untitled</title>
<style type="text/css">
<!--
/* 필수입력 */
.essential{ color: #FD0505;}
-->
</style> 
<script language="JavaScript">
function fncChange(){
  var selDiv = frm.selDiv.value;
  if(selDiv == "T"){
    document.getElementById("spCarryAppointYmd").className = "essential";
    document.getElementById("spCarryAppointYmd").innerHTML = "*";
  }else if(selDiv == "F"){
    document.getElementById("spCarryAppointYmd").className = "";
    document.getElementById("spCarryAppointYmd").innerHTML = "";
  }
}
</script>
</head>


<body>
<form name="frm">
<table>
  <tr>
    <td>
      <select onchange="fncChange();"  name="selDiv">
        <option value="T">필수
        <option value="F">해제
      </select>
    </td>
  </tr>
  <tr>
    <td><span id="spCarryAppointYmd" class="essential">*</span>필수입력</td>
  </tr>
</table>
</form>
</body>
</html>