如何在 JavaScript 中更改用戶輸入值（提示）的字體顏色？

Question

如何更改變量編號 ( nb ) 的值的顏色？ 如何在 JavaScript 中更改用戶輸入值（提示）的字體顏色？


<html>
    <head>
        <style>
            #block{
                color: white;
                width: 300px;
                height: 60px;
                background-color: #2b2e2e;
                text-align: center;
                padding-top: 30px;
            }
        </style>
    </head>
    <body>
        <div id="block">
            
        </div>
        <script>
            window.onload = function printNumber(){
                var unBlock = document.getElementById("block");
                var nb = Number(prompt("Saisir un nombre: "));
                
                if(nb == null || nb == ""){
                    unBlock.innerHTML = "No input number.";
                }else{
                    unBlock.innerHTML = "Your input number is "+nb;
                }
                
            }
        </script>
    </body>
</html>

Answer 1

下面的代碼說明了兩種方式。

通過創建一個帶有colored作為其類的跨度，它會變成藍色。
隨后，在我的代碼中，我通過使用 javascript 將其變為紅色來覆蓋它。

這兩種方法中的任何一種都可以使用，但您只需要一種，而不是兩種都需要。 我使用兩者只是為了說明您的選擇。

 window.onload = function printNumber() { var unBlock = document.getElementById("block"); var nb = Number(prompt("Saisir un nombre: ")); if (nb == null || nb == "") { unBlock.innerHTML = "No input number."; } else { unBlock.innerHTML = `Your input number is <span class='colored'>${nb}</span>`; //the next line will select your span and override blue with red. document.querySelector("span.colored").style.color = 'red'; } }

 #block { color: white; width: 300px; height: 60px; background-color: #2b2e2e; text-align: center; padding-top: 30px; } span.colored { color: blue; }

 <div id="block"> </div>

如何在 JavaScript 中更改用戶輸入值（提示）的字體顏色？

問題描述

1 個解決方案

解決方案1
2 已采納 2020-11-19 16:46:19

如何在 JavaScript 中更改用戶輸入值（提示）的字體顏色？

問題描述

1 個解決方案

解決方案1 2 已采納 2020-11-19 16:46:19

解決方案1
2 已采納 2020-11-19 16:46:19