Heim  >  Artikel  >  Web-Frontend  >  So verwenden Sie Javascript, um vier arithmetische Operationen zu implementieren

So verwenden Sie Javascript, um vier arithmetische Operationen zu implementieren

PHPz
PHPzOriginal
2023-04-06 09:05:242062Durchsuche

In der Webentwicklung ist JavaScript eine sehr beliebte Programmiersprache. Mit JavaScript können viele interessante Funktionen erreicht werden, beispielsweise die Implementierung einfacher vier arithmetischer Operationen. In diesem Artikel stellen wir vor, wie Sie mit JavaScript vier arithmetische Operationen implementieren.

1. HTML-Struktur

Zunächst müssen wir eine HTML-Datei erstellen und in der Datei ein Textfeld zur Eingabe von Ausdrücken, Schaltflächen für vier Operatoren und einen Bereich zur Anzeige der Ergebnisse hinzufügen. Der HTML-Code lautet wie folgt:

nbsp;html>


    <meta>
    <title>用JavaScript实现四则运算</title>


    <input>
    <button>+</button>
    <button>-</button>
    <button>*</button>
    <button>/</button>
    <p></p>
    <script></script>

In dieser HTML-Struktur verwenden wir das Eingabeelement als Textfeld für Eingabeausdrücke, das Schaltflächenelement als Schaltflächen für die vier Operatoren und fügen auf diesen Schaltflächen Aufrufe der Berechnungsfunktion hinzu. Darüber hinaus haben wir einen Bereich zum Anzeigen von Ergebnissen hinzugefügt. Das id-Attribut des p-Elements ist result. Wir werden diese ID verwenden, um den Bereich zum Anzeigen von Ergebnissen abzurufen.

2. JavaScript-Code

Als nächstes müssen wir eine JavaScript-Datei schreiben, um die vier arithmetischen Operationen zu implementieren. Der JavaScript-Code lautet wie folgt:

function calculate(operator) {
    var expression = document.getElementById("expression").value; //获取表达式
    var operArr = expression.split(operator); //分割表达式
    var numArr = []; //存储数字
    for(var i = 0; i <p>In diesem JavaScript-Code definieren wir eine Berechnungsfunktion, um vier arithmetische Operationen für den Eingabeausdruck auszuführen. In der Funktion erhalten wir zunächst den vom Benutzer eingegebenen Ausdruck über document.getElementById("expression").value, teilen den Ausdruck dann über die Split-Methode in zwei Zahlen auf und speichern die beiden Zahlen in einem Array. Anschließend werden die vier Operatoren über die Switch-Anweisung unterschiedlich verarbeitet und schließlich werden die Ergebnisse über document.getElementById("result").innerHTML auf der Seite angezeigt. </p><p>3. Nachdem wir den Code mit </p><p> geschrieben haben, müssen wir nur noch die HTML-Datei im Browser öffnen, einen Ausdruck eingeben, einen Operator auswählen und dann auf das Gleichheitszeichen klicken, um das Operationsergebnis zu erhalten und es auf der Seite anzuzeigen. Wie unten gezeigt: </p><p><img src="https://img.php.cn/upload/article/000/000/068/168075020156607.png" alt="So verwenden Sie Javascript, um vier arithmetische Operationen zu implementieren" title="So verwenden Sie Javascript, um vier arithmetische Operationen zu implementieren"></p><p> IV Zusammenfassung </p><p>Anhand der Einleitung dieses Artikels können wir sehen, dass es sehr einfach ist, einfache vier arithmetische Operationen in JavaScript zu implementieren. Mit nur einigen grundlegenden JavaScript-Syntax- und HTML-Strukturen können wir die vier arithmetischen Operationen problemlos implementieren. Ich hoffe, dass dieser Artikel allen beim Erlernen und Verwenden von JavaScript hilfreich sein kann. </p>

Das obige ist der detaillierte Inhalt vonSo verwenden Sie Javascript, um vier arithmetische Operationen zu implementieren. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn