一，效果图。

二，代码。

<!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>

参考资料：《菜鸟教程》

【代码笔记】Web-JavaScript-JavaScript 运算符的更多相关文章

  1. WEB前端--JavaScript

    JavaScript JavaScript基础 一.JavaScript简介 JavaScript是一种嵌入到HTML文件中的描述性语言,由浏览器的解释器将其动态地处理成可执行的代码,能独立地完成与客 ...

  2. JavaScript instanceof 运算符深入剖析

    简介: 随着 web 的发展,越来越多的产品功能都放在前端进行实现,增强用户体验.而前端开发的主要语言则是 JavaScript.学好 JavaScript 对开发前端应用已经越来越重要.在开发复杂产 ...

  3. JavaScript instanceof 运算符深入剖析【转载】

    http://www.ibm.com/developerworks/cn/web/1306_jiangjj_jsinstanceof/   instanceof 运算符简介 在 JavaScript ...

  4. Web Worker javascript多线程编程（一）

    什么是Web Worker? web worker 是运行在后台的 JavaScript,不占用浏览器自身线程,独立于其他脚本,可以提高应用的总体性能,并且提升用户体验. 一般来说Javascript ...

  5. Web Worker javascript多线程编程（二）

    Web Worker javascript多线程编程(一)中提到有两种Web Worker:专用线程dedicated web worker,以及共享线程shared web worker.不过主要讲 ...

  6. javascript算术运算符详解

    算术运算符 +.-.*./.%.++.-- ++.--分为前缀形式和后缀形式 前缀形式先加减1在执行 后缀形式先执行再加减1 注意 +号用来连接两个字符串 只要+连接的操作数中有一个是字符串型,JS就 ...

  7. 2015年10个最佳Web开发JavaScript库

    2015年10个最佳Web开发JavaScript库 现在的互联网可谓是无所不有,有大量的JavaScript项目开发工具充斥于网络中.我们可以参考网上的指导来获取构建代码项目的各种必要信息.如果你是 ...

  8. WEB 技术分类 Javascript DOM(Element Node) BOM

    Web technology for developers   Web 技术文档 备注:本文介绍web technology的分类,各自职责,因为之前一直就没有搞明白各种技术.各种名词究竟是属于哪个范 ...

  9. Web前端-JavaScript基础教程上

    Web前端-JavaScript基础教程 将放入菜单栏中,便于阅读! JavaScript是web前端开发的编程语言,大多数网站都使用到了JavaScript,所以我们要进行学习,JavaScript ...

  10. JavaScript instanceof 运算符

    instanceof运算符简介 在 JavaScript 中 判断一个变量的类型常常会用 typeof 运算符 判断一个实例是否属于某种类型会使用instanceof 与 typeof 方法不同的是, ...

随机推荐

  1. 终于明白word-break属性——break-all和break-word的区别

      其实一直不明白,也没有认真去想过 word-break 属性的 break-all 和 break-word 有什么区别 后来看了一个大神写的一篇博客,写得很详细,看了豁然开朗. 所以,我也就不在 ...

  2. js-完整轮播图

     js-完整轮播图 今天写一个完整的轮播图,首先它需要实现三个功能:1.鼠标放在小圆点上实现轮播.2.点击焦点按钮实现轮播.3.无缝自动轮播. 轮播图的原理: 一系列的大小相等的图片平铺,利用CSS布 ...

  3. 从TXT文本文档向Sql Server中批量导入数据

    下面我们通过以下的简单的SQL语句即可实现数据的批量导入,代码如下: Bulk insert id From 'G:\文档\test.txt' With ( fieldterminator=',', ...

  4. 如何使用 GDB

    前期准备 启动GDB方法 设置运行参数 查看源码 断点break 使用 运行程序 查看运行时数据 查看内存数据 分割窗口 问题汇总 参考文献 GDB, The GNU Project debugger ...

  5. 解决ionic <ion-nav> rootParams获取不到参数

    在使用ion-nav 标签的时候 设置的页面 无法拿到传递的参数 import { Component } from '@angular/core'; import { GettingStartedP ...

  6. 使用.NET Hardware Intrinsics API加速机器学习场景

    ML.NET 0.6版本刚刚发布不久,我们知道ML.NET代码已经依赖于使用本机代码库的性能矢量化.这是一个重新实现托管代码中现有代码库的机会,使用.NET Hardware Intrinsics进行 ...

  7. 健康，home？ [java的内存浅析]

    摘要: 原创出处: http://www.cnblogs.com/Alandre/ 泥沙砖瓦浆木匠 希望转载,保留摘要,谢谢! 乐观上上,how can other kno u,u r yoursel ...

  8. eclipse制作exe文件

    1.右击你的项目,选择Export: 2.选择Java目录下的JAR file: 3.设置导出jar文件的路径,我这里选择的是桌面,点击Next: 4.这一步默认,不用改动,直接Next: 5.设置项 ...

  9. PYTHON 格式字符串中的填充符

    使用 %类型 来填充 常用的有:%s 填充字符串类型:%d 填充 int 类型:这里是沿用了 C语言中 printf() 函数中的格式,更多的信息请查看:完整列表 name = 'tommy' mes ...

  10. 翻译：INSERT(已提交到MariaDB官方手册)

    本文为mariadb官方手册:INSERT的译文. 原文:https://mariadb.com/kb/en/insert/我提交到MariaDB官方手册的译文:https://mariadb.com ...