Форматирование вывода document.write() в JavaScript

Я создал простой калькулятор, который сообщает вам, что вы заработали на основе оценки, которую вы получили в классе. Однако я пытаюсь отформатировать текст document.write(). Вместо того, чтобы просто печатать текст, я хочу, чтобы он печатал текст с шрифтом определенного размера, конкретным цветом фона на веб-странице (только вокруг вывода document.write()), и я также хочу подчеркнуть полученный результат.Форматирование вывода document.write() в JavaScript

<html> 
<head><title>Letter-Grade Calculator</title></head> 
<body> 
<h3>Letter-Grade Calculator</h3> 
    <script type="text/javascript"> 

    var score = parseFloat(prompt ("What is your score?")); 

    if (score >= 90){ 
     document.write("The score you entered is: " + score + ". Your letter grade is: A!"); 
} 
    else if (score >= 80 && score <= 89.9){ 
     document.write("The score you entered is: " + score + ". Your letter grade is: B!"); 
} 
    else if (score >= 70 && score <= 79.9){ 
     document.write("The score you entered is: " + score + ". Your letter grade is: C!"); 
} 
    else if (score >= 60 && score <= 69.9){ 
     document.write("The score you entered is: " + score + ". Your letter grade is: D!"); 
} 
    else { 
     document.write("The score you entered is: " + score + ". Your letter grade is: F!"); 
} 

    </script> 
</body> 
</html>

Я устал назначая текст в пределах каждого document.write() для конкретной переменной, то вызов этой переменной внутри document.write() (пример: скажем, у меня есть переменная «gradeA», а затем установить первое условие if, чтобы возвратить 'document.write (gradeA);' if true), а затем используя определенные расширения, которые я нашел онлайн, чтобы попытаться изменить переменную. Но я не смог получить его для вывода того, что мне было нужно.

источник

2015-10-22 sedkil

Почему бы вам просто не создать пустой элемент, не стилизовать его с помощью CSS, а затем изменить его свойство 'innerHTML' на текст, который у вас есть, вместо использования' document.write'? – j08691

вы можете использовать элемент div и добавить результат там, используя innerHTML –

использование CSS и теги ...

<html> 
<head><title>Letter-Grade Calculator</title></head> 
<body> 
<h3>Letter-Grade Calculator</h3> 
<style> 
    .red {background: red;}; 
    .blue {background: blue;}; 
    .green {background: green;}; 
    .yellow {background: yellow;}; 
    .black {background: black;}; 
</style> 
    <script type="text/javascript"> 

    var score = parseFloat(prompt ("What is your score?")); 

    if (score >= 90){ 
     document.write("<span class='red'>The score you entered is: " + score + ". Your letter grade is: A!</span>"); 
} 
    else if (score >= 80 && score <= 89.9){ 
     document.write("<span class='green'>The score you entered is: " + score + ". Your letter grade is: B!</span>"); 
} 
    else if (score >= 70 && score <= 79.9){ 
     document.write("<span class='blue'>The score you entered is: " + score + ". Your letter grade is: C!</span>"); 
} 
    else if (score >= 60 && score <= 69.9){ 
     document.write("<span class='yellow'>The score you entered is: " + score + ". Your letter grade is: D!</span>"); 
} 
    else { 
     document.write("<span class='black'>The score you entered is: " + score + ". Your letter grade is: F!</span>"); 
} 

    </script> 
</body> 
</html>

источник

2015-10-22 17:08:29 taxicala

Это именно то, что я искал, чтобы изменить цвет фона вывода только в веб-документе! Тем не менее, я также должен подчеркнуть, что вывод будет иметь определенный размер шрифта. Итак, как я могу применить 3 класса с

Форматирование вывода document.write() в JavaScript

ответ