<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

    <title>javascript 运算符</title>

</head>

<body>

    <!--javascriptyu运算符-->

    <p>惦记按钮计算</p>

    <button onclick="myFunction0()">点击这里</button>

    <p id="demo0"></p>

    <script>

    function myFunction0() {

        y = 5;

        z = 2;

        x = y + z;

        document.getElementById("demo0").innerHTML = x;

    }

    </script>

    <!--用于字符串的+运算符-->

    <p>点击按钮创建及增加字符串变量</p>

    <button onclick="myFunction()">点击这里</button>

    <p id="demo"></p>

    <script>

    function myFunction() {

        txt1 = "What a very";

        txt2 = "nice day";

        txt3 = txt1 + txt2;

        document.getElementById("demo").innerHTML = txt3;

    }

    </script>

    <!--在字符串中增加空格-->

    <p>点击按钮创建及增加字符串变量。</p>

    <button onclick="myFunction1()">点击这里</button>

    <p id="demo1"></p>

    <script>

    function myFunction1() {

        txt1 = "What a very ";

        txt2 = "nice day";

        txt3 = txt1 + txt2;

        document.getElementById("demo1").innerHTML = txt3;

    }

    </script>

    <p>点击按钮创建及增加字符串变量</p>

    <button onclick="myFunction2()">点击这里</button>

    <p id="demo2"></p>

    <script>

    function myFunction2() {

        txt1 = "what a very";

        txt2 = "nice day";

        txt3 = txt1 + " " + txt2;

        document.getElementById("demo2").innerHTML = txt3;

    }

    </script>

    <!--对字符串和数字进行加法运算-->

    <P>点击按钮创建及增加字符串变量</p>

    <button onclick="myFunction()">点击这里</button>

    <p id="demo3"></p>

    <script>

    function myFunction() {

        var x = 5 + 5;

        var y = "5" + 5;

        var z = "hello" + 5;

        var demoP = document.getElementById("demo");

        demoP.innerHTML = x + "<br>" + y + "<br>" + z;

    }

    </script>

</body>

</html>