Home > Article > Web Front-end > How do I change the string to be displayed as superscript using JavaScript?

How do I change the string to be displayed as superscript using JavaScript?

WBOYforward: 2023-08-30 14:45:111368browse

如何使用 JavaScript 更改要显示为上标的字符串？

In this tutorial, we will learn to use JavaScript to change the string that is displayed as a superscript. As the name suggests, superscript strings appear at half the height of regular strings. Also, the characters of a superscript string are smaller than those of a normal string.

Superscripting strings has many uses when writing mathematical formulas. For example, A², B², 10⁵, etc. In addition, we can also use superscripts to represent chemical formulas, such as O ₂²-, H-, etc.

Here, users can use HTML or JavaScript to learn how to Strings are displayed as superscript.

Display a string as a subscript using HTML only

In this section, we will learn to display a string as a superscript using the HTML ^{tag. Any string written by the user within the HTML tag will appear in small characters at half height above the normal string.}

Syntax

Users can follow the following syntax to render a string as a superscript using only HTML.

<p> (10)<sup> 2</sup> </p> // output is (10)2

Example

In the following example, we use HTML ^{tags to render some mathematical formulas in the correct format.}

<html>
<head>
</head>
<body>
   <h2> displayed string as a superscript using JavaScript. </h2>
   <h4> Various examples of superscript string using Row HTML. </h4>
   <p> A<sup>3 </sup> </p>
   <p> A<sup>2 </sup> + B<sup>2 </sup> + 2*A*B = (A+B)<sup>2 </sup> </p>
</body>
</html>

In the above output, the user can see how we write mathematical formulas using HTML tags.

Display string as subscript using HTML and JavaScript

Here, we will learn about JavaScript string.sup() method. It is a built-in library method that returns a string embedded in the HTML ^{tag. Therefore, when the user needs to write a string directly in HTML, the above method can be used, and when the user needs to use JavaScript to generate a string and write it into the HTML body, the user can use the string.sup() method.}

Syntax

Users can use the JavaScript string.sup() method according to the following syntax.

let str = "5";
let output = "10" + string.sup(); // returns 105
let output = "x" + "2".sup(); // returns x2

Return value

The string.sup() method returns the string within the ^{HTML tag.}

<sup> string <sup>

Example

<html>
<head>
</head>
<body>
   <h2> displayed string as a superscript using JavaScript. </h2>
   <div id = "superscript"> </div>
   <div id = "deprecated"> <br>The String sup() method is deprecated. So use <i>sup</i> tag. <br></div>
</body>
<script>
   var superscript = document.getElementById("superscript");
   let string = "5";
   let x = 10;
   let result = x + string.sup() + " = " + Math.pow( 10, 5 ) + ". <br/>";
   superscript.innerHTML = result;
   result += "5" + "2".sup() + " = " + Math.pow( 5, 2 ) + ". <br/>";
   superscript.innerHTML = result;
   var str = "<sup>Demo Text</sup>";
   deprecated.innerHTML += "<br>This is subscript" + str;
</script>
</html>

In this tutorial, we learned about rendering a string as a superscript. This is a very useful feature provided by HTML. The user can directly display the string as a superscript using the HTML tag, or they can use the JavaScript string.sup() method, it doesn't matter because the super() method also returns the same value By embedding the string in ^tags.

The above is the detailed content of How do I change the string to be displayed as superscript using JavaScript?. For more information, please follow other related articles on the PHP Chinese website!

JavaScript html String 字符串

Statement：

This article is reproduced at:tutorialspoint.com. If there is any infringement, please contact admin@php.cn delete

Previous article：How to view an array of structures in JavaScript?Next article：How to view an array of structures in JavaScript?

See more

How do I change the string to be displayed as superscript using JavaScript?

Display a string as a subscript using HTML only

Syntax

Example

Display string as subscript using HTML and JavaScript

Syntax

Return value

Example

Related articles