我把它寫成 res.send()。 所以gettingTO一個沒有CSS的頁面只是我寫的數據來改變那個頁面的CSS屬性如何做到這一點

Question

我已經為天氣應用程序編寫了這段代碼，如何更改數據發布頁面的背景和 CSS 屬性

app.post("/", (req, res) => {

    const query = req.body.cityName;
    const apiKey = "48a9ebfd3c72f0c53af5c483631e82ad";
    const unit = "metric";
    const url = "https://api.openweathermap.org/data/2.5/weather?q=" + query + "&appid=" + apiKey + "&units=" + unit;

    https.get(url, (response) => {
        console.log(response.statusCode);

        response.on("data", (d) => {
            const weatherData = JSON.parse(d);
            const weatherDescription = weatherData.weather[0].description;
            const temp = weatherData.main.temp;
            const windSpeed = weatherData.wind.speed;
            const pressure = weatherData.main.pressure;
            const icon = weatherData.weather[0].icon;
            const imageUrl = "http://openweathermap.org/img/wn/" + icon + "@2x.png";

            res.write("<p>Temperature  " + query + " is " + temp + "  degrees celcius.</p>");
            res.write("<p> Weather description - " + weatherDescription + "</p>");
            res.write("<p>Wind speed " + windSpeed + " Km/hr </h4>");
            res.write("<p>Pressure is  " + pressure + " mbar </p>");
            res.write("<img src=" + imageUrl + "> ");
            res.send();
        });
    });
});

Answer 1

我現在從你的評論中明白了:)
如果要更改 css，則需要將style屬性添加到 html 標簽。

例如：

res.write("<p style='background-color:red;'>Temperature  " + query + " is " + temp + "  degrees celcius.</p>");

您可以在這里找到更多信息： https://www.w3schools.com/html/html_css.asp#:~:text=try%20it%20yourself.-,Inline%20CSS,-An%20inline%20CSS