jsp页面中JS代码使用后台数据作为条件来改变jsp样式

关于如何解决在一个jsp页面中JS代码使用后台数据作为条件来改变jsp样式的问题，严格来讲写js代码时，其本身并不能获得后台数据，但是可以间接从jsp中使用document.getElementById(“ ”).value来获得，而我们就可以在jsp代码中写几个隐藏的input，即：

<input type="hidden" id="real1" value="${realState.txxinhaozl }" />

<input type="hidden" id="real2" value="${realState.tantoudy }" />

<input type="hidden" id="real3" value="${realState.qyzh }" />

设置type为hidden，则隐藏input，value则使用El表达式获取后台数据，然后就可以使用document.getElementById(“”).value来间接获得后台数据。

<script type="text/javascript">

   var real1 = document.getElementById("real1").value;

         if(real1<5){

            $(".Info1").css({color:"red"});

            $(".Sign").attr({src:"<%=basePath%>/styles/monitor/images/Sign_3.png"});

        }else if(real1>8){

            $(".Info1").css({color:"green"});

            $(".Sign").attr({src:"<%=basePath%>/styles/monitor/images/Sign_1.png"});

        }else{

            $(".Info1").css({color:"orange"});

            $(".Sign").attr({src:"<%=basePath%>/styles/monitor/images/Sign_2.png"});

       }

</script>

<div class="panel collapse">

       <h1>信号质量</h1>

       <div>

              <div class="accountInfo">

                     <div class="alertInfo">

                            <div >

                               <h2 class="Info1">状态:${xhzl }</h2>

                            </div>

                     </div>

                     <div class="right">

                            <img  class="Sign" src="">

                      </div>

                      <div class="Info">设备信号质量：</div>

                      <div class="Info1" id="Infoo">${realState.txxinhaozl}</div>

                       <p>(将通讯信号强度设定为1-10个等级 )</p>

              </div>

        </div>

</div>