JavaScriptの読み込み.txtファイルとHTMLで表示

Question

HTMLページにJavaScriptを設定すると、同じディレクトリに.txtファイル（status.txt）を読み込んで、その内容を2つの異なるフォント色で表示しようとしています.txtファイルの情報私は現在、ページ上にテキストを表示していますが、もう少し目立つようにしたかったのです。ここに、#cccの基本的な16進数でテキストを表示するための私の現在のコードを示します。

<script type="text/javascript"> 
    loadXMLDoc(); 
</script> 
<script type="text/javascript"> 
    function loadXMLDoc() { 
    var xmlhttp; 
    if (window.XMLHttpRequest) { 
     xmlhttp = new XMLHttpRequest(); 
    } 
    xmlhttp.onreadystatechange = function() { 
     if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
     document.getElementById("status").innerHTML = xmlhttp.responseText; 
     } 
    } 
    xmlhttp.open("GET", "status.txt", true); 
    xmlhttp.send(); 
    } 
</script> 

<h3 id="status" style="padding-right: 7px; padding-left: 7px; margin-top: 2px; font-size: 11px; color: #cccccc"> 
    Status 
</h3> 

.vbsファイルが実行されるたびにテキストファイルの内容が上書きされます。それはどちらかと言うだろう：

6/11/2016 8:58:30 AM Script Started 

または

6/11/2016 9:31:12 AM Script Stopped 

タイムスタンプで変更する唯一のもの。 "（タイムスタンプ）スクリプトが停止しました"と表示されたら赤で表示し、 "タイムスタンプ"スクリプトが起動したら緑で表示します。もし誰かが助けることができれば、それは素晴らしいだろう！

Answer 1

var color = xmlhttp.responseText.indexOf('Started') !== -1 ? 'green' : 'red'; 
document.getElementById("status").innerHTML = '<span style="color: ' + color + '">' + xmlhttp.responseText + '</span>'; 

Answer 2

単純な正規表現を使用すると、適切なクラスをテキストに追加できます。

document.getElementById("status").innerHTML = xmlhttp.responseText 
    .replace(/(\b\d.+?Started)/ig,'<span class="start">$1</span>') 
    .replace(/(\b\d.+?Stopped)/ig,'<span class="stop">$1</span>'); 
    //\b -start of word, \d - any digit 0 to 9, . - any character 
    // +? - one ore more, not greedy