The HTML code to wrap text in font size tags can be generated using JavaScript.
MyHTML = MyText.fontsize(number);Important Note
The fontsize() method is not standardized and may not behave consistently in all browsers.
The method produces old HTML code that utilizes a font size tag that does not exist in HTML 5.
The font size tag is not desirable as only values of 1 through 7 can be specified for the font size.
It should be avoided if possible, and CSS should be used instead. An example using CSS is provided here.
JavaScript String fontsize() Method Example
<!DOCTYPE html>
<html lang="en">
<head>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
<meta content="utf-8" http-equiv="encoding">
<title>JavaScript String fontsize() Method Example</title>
</head>
<body>
<script>
var MyText = "Sample Text With the fontsize HTML Tag Set To 5";
var MyHTML = MyText.fontsize(5);
document.write(MyHTML);
</script>
</body>
</html>The code above produces a blank HTML document with the following HTML:
<font size="5">Sample Text With the fontsize HTML Tag</font>Alternative to Using the fontsize() Method using CSS
Even though the most commonly used browsers treat the fontsize method consistently, it is still better to avoid potential issues by creating the needed HTML code inside a string and then inserting that HTML into the DOM.
Example JavaScript fontsize() Method Alternative:
<!DOCTYPE html>
<html lang="en">
<head>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
<meta content="utf-8" http-equiv="encoding">
<title>JavaScript String fontsize() Method Alternative</title>
</head>
<body>
<h1>An Example of How To Change the Text Size with JavaScript</h1>
<script>
var MyText = "Example of large text generated with CSS and HTML in JavaScript.";
var MyStyle = "<style>.large-text{font-size: 32px;}</style>";
var MyHTML = "<span class=\"large-text\">" + MyText + "</span>";
document.head.innerHTML += MyStyle;
document.body.innerHTML += MyHTML;
</script>
</body>
</html>Which will create the following HTML:
<span class="large-text">Example of large text generated with CSS and HTML in JavaScript.</span>The example will also insert the following CSS style into the document’s header:
<style>.large-text{font-size: 32px;}</style>The Pure HTML & CSS Alternative
In the case that JavaScript can be completely avoided, an inline style can be used instead.
<span style="font-size: 32px">Example of Large Text with HTML and CSS.</span>Using the fontsize() Method With An Invalid Argument
Passing an invalid argument to this method does not generate an error message and will usually result in text that is colored green in the browser.
document.write('test123'.fontsize("invalid") + '<br>');
//The size is invalid and will default to 3
document.write('test123'.fontsize() + '<br>');
//The size attribute will be "undefined"
document.write('test123'.fontsize("123") + '<br>');
//The size of the font will be the same as 7Using the fontsize() Method Without a Variable
It is worth mentioning that the fontsize method can be called on a string that is not stored in a variable.
The following code will work but is discouraged because it can be confusing to read.
document.write('Very Large Text'.fontsize(7));JavaScript will determine that the text within the quotes is a string and apply the fontsize() method to it.