html变量的一部分更改字体大小和字体背景

Question

你好！

我有一个自动生成的文本，该文本始终在变化，但始终包含“ Q + 4位数字”。

<style>
                .metarrovid {
                  color: #000000;
                  position: absolute;
                  z-index: 8;
                  display: block;
                  font-weight: bold;
                  left: -1250px;
                  top: 315px;
                  font-family: arial;
                  font-size: 30px;
                  max-width: 700px;
                }
</style>
<?php

    $text=file_get_contents('http://tgftp.nws.noaa.gov/data/observations/metar/stations/LHBP.TXT');
    $metar = $text;
    $metarrovid = substr($metar,16,10000);
    echo '<div class="metarrovid">', "MET REPORT" .$metarrovid,'</div>';
?>

看起来像这样：

我的问题是我该怎么做（在此示例中为“ Q1017”），并使其背景变为黄色：

我希望它看起来像这样（仅用于说明）：

Answer 1

我可以使用javascript制作！

<script>    
window.onload = function() { 
    var domText = document.querySelector("body").innerHTML; 
    document.querySelector("body").innerHTML = domText.replace(/(.)(Q\d{4})(.)/, "$1<span style='font-size:24px;color:red;'>$2</span>$3") 
}
</script> 

您必须选择要更改的dom女巫。 document.querySelector（“ body”）同时替换body标记中的所有文本。