innerHTML 인라인 CSS 시나리오에서 Javascript를 사용하는 방법?

Question

나는 html5 및 PHP에 새로운입니다. 내 작성된 코드의 경우 자바 스크립트를 사용하는 방법을 궁금합니다.

데이터베이스의 데이터를 HTML 형식의 테이블에 출력하고 있습니다. 마지막으로 좀 더 오른쪽으로 출력하고 싶습니다. 내가 인라인 CSS 스타일을 사용하는 경우하지만 구문 분석 오류가 점점 오전 :

내 코드 : 데이터 어떠했는지를 내 데이터베이스에 따라에

<table class="scroll"> 
    <thead style="background-color: #99E1D9; color: #705D56;"> 
     <tr> 
      <th>ID</th> 
      <th>Name</th> 
      <th>Last Update</th> 
      <th style="padding-left: 30%;">Status</th> 
     </tr> 
    </thead> 
     <tbody id="hoverTable"> 
       <?php 

        $connection = mysql_connect('localhost', 'root', ''); 

        mysql_select_db('patientdb'); 

        $query = "SELECT id, name, date, status FROM clients"; 

        $result = mysql_query($query); 

        while($row = mysql_fetch_array($result)){ //looping through results 
        echo "<tr> 
          <td>" . $row['id'] . "</td> 
          <td>" . $row['name'] . "</td> 
          <td>" . $row['date'] . "</td> 
          <td class=\"fa fa-circle\" style=\"color: grey; margin-left: \30%;\"></td> //my question is regarding this line!!!! 
         </tr>"; //$row['index'] the index here is a field name 
        } 

        mysql_close(); 

       ?> 
</tbody> 
</table> 

내 목표는 따라 지난 <td>의 출력의 색상을 변경하는 것입니다

if (x > 60) { 
    echo: "orange output"; 
}elseif (x >50) { 
    echo: "red output"; 
}else{ 
echo: "green output"; 
} 

**** 내 현재의 경우 ****에 JS를 사용할 수있는 방법

편집 : : 시도 솔루션이 논리에 의

<script> 
    $('#hoverTable td').css('background-color',function(){ 
     var x = DATA FROM MY DATABASE; 
      if (x > 50) { 
      echo: "orange output"; 
      }elseif (x >60) { 
      echo: "red output"; 
      }else{ 
      echo: "green output"; 
      } 
    }); 
    </script> 

표 코드는

<table class="scroll"> 
    <thead style="background-color: #99E1D9; color: #705D56;"> 
     <tr> 
      <th>ID</th> 
      <th>Naam Client</th> 
      <th>Laatste Update</th> 
      <th style="padding-left: 30%;">Status</th> 
     </tr> 
    </thead> 
     <tbody id="hoverTable"> 
       <?php 

        $connection = mysql_connect('localhost', 'root', ''); //The Blank string is the password 
        mysql_select_db('patientdb'); 

        $query = "SELECT id, naam, datum, status FROM clients"; //You don't need a ; like you do in SQL 
        $result = mysql_query($query); 

        while($row = mysql_fetch_array($result)){ 
         $statusClass = 'class="green output"'; 

         if($row['status'] > 60){ 
          $statusClass = 'class="red output"'; 
         }else if($row['status'] > 50){ 
          $statusClass = 'class="orange output"'; 
         } 
         echo 
         '<tr> 
         <td>' . $row["id"] . '</td> 
         <td>' . $row["name"] . '</td> 
         <td>' . $row["date"] . '</td> 
         <td class="fa fa-circle" style="color: grey; margin-left: 30%;" .$statusClass."></td> 
         </tr>'; 
        } 
        mysql_close(); //Make sure to close out the database connection 
       ?> 
</tbody> 
</table> 

Answer 1

인사가 마지막 "TD"코드는 다음과 같이 할 수있다 :

while($row = mysql_fetch_array($result)){ 
    $statusClass = 'green output'; 

    if($row['status'] > 60){ 
     $statusClass = 'red output'; 
    }else if($row['status'] > 50){ 
     $statusClass = 'orange output'; 
    } 

    echo '<tr> 
    <td>' . $row["id"] . '</td> 
    <td>' . $row["name"] . '</td> 
    <td>' . $row["date"] . '</td> 
    <td class="fa fa-circle '.$statusClass.'" style="color: grey; margin-left: 30%;"></td> 
</tr>' 
} 

이 유 1 위의 조건에서 가장 높은 수를 가지고 있는지 확인, 때문에 이 코드를 사용하는 경우

if (x > 50) { 
    echo: "orange output"; 
}elseif (x >60) { 
    echo: "red output"; 
}else{ 
    echo: "green output"; 
} 

x는 65 대신 "붉은 출력"의 "오렌지 출력"첫 번째 문은 사실이기 때문에, 여기서 x는 50보다 큰

입니다 반환

그리고 jquery를 사용하는 것이 가장 간단한 방법입니다. 위의 메모는 선택기 '테이블'대신 표에 ID를 적용합니다.

$("#hoverTable td")... 

Answer 2

당신은 PHP에서 라인을 깰 수 없습니다. 이 옵션을 사용 : 각 라인의 끝을 연결하거나 heredoc을 사용할 필요가

echo "<tr>". 
"<td>" . $row['id'] . "</td> ". 
"<td>" . $row['name'] . "</td> ". 
"<td>" . $row['date'] . "</td>". 
"<td class=\"fa fa-circle\" style=\"color: grey; margin-left: \30%;\"></td> ". 
"</tr>"; 

.

Answer 3

jQuery를 사용하는 경우 직선입니다. 당신이 PHP와 상태에 사용하려는 경우

$('#hoverTable td:last-child').css('background-color',function(){ 
    var x = /*your target argument*/; 
    if(x > 50){return 'orange '}; 
});