专栏首页acoolgiser_zhuanlanJavaScript中的 innerHTML 字符与变量拼接赋值

JavaScript中的 innerHTML 字符与变量拼接赋值

如图,在html中有一个div,给其设置文本:字符串与变量的拼接

代码:

<body>
    <div id='divtest'></div>
</body>
<script>
    var dis = 34;
    document.getElementById('divtest').innerHTML = "test" + dis;        //这里注意变量的拼接
    document.getElementById('divtest').innerHTML += "test2" + (dis+1);  //这里注意变量的拼接
</script>

 注意这样写只会显示字符串,整型变量无法显示,要改成 parseInt(dis) ,才能达到如图的效果。

<body>
    <div id='divtest'></div>
</body>
<script>
    var dis = 34;
    document.getElementById('divtest').innerHTML = "test" + parseInt(dis);        //这里注意变量的拼接
    document.getElementById('divtest').innerHTML += "test2" + parseInt(dis+1);    //这里注意变量的拼接
</script>

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • vue.js中的v-if指令 使用template同时判断多个元素

    当同时要控制多个元素(比如多个div,或其他元素)的显示与否时,可以使用vue.js的内置指令template把这多个元素包含起来,如下:

    acoolgiser
  • There's no Qt version assigned to this project for platform Win32. Please use the 'change Qt version

    版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。 ...

    acoolgiser
  • weex环境配置 weex create project 提示错误 Error: Cannot find module 'async'

     安装完以后,执行命令:weex help 一直提示错误: Error: Cannot find module 'async'

    acoolgiser
  • 1 Java8对于多线程并发的一些新支持-LongAdder

    我们知道AtomicLong、AtomicInteger是基于硬件级别cas实现的保证线程安全的自增类,能保证原子化的自增操作。在多线程下,性能远好于加锁syn...

    天涯泪小武
  • 在yii2验证之前执行一些额外自定义验证

    (adsbygoogle = window.adsbygoogle || []).push({});

    双面人
  • 新特性解读 | MySQL 8 复制延迟观测新方式,更全面更精准

    一直以来 MySQL 复制延迟观测是不完善的,既无法观测到真实的主从延迟,也无法支持复杂的复制拓扑环境,常用的 second_behind_master 指标更...

    爱可生开源社区
  • iOS中Block的用法,举例,解析与底层原理(这可能是最详细的Block解析)

    【摘要】这篇文章,首先在第1节中介绍Block的定义,以及与C里面函数的对比。然后,第2节介绍实际开发中经常会用到的Block语法形式,以供读者日后查阅。只知道...

    陈满iOS
  • HDU 4081 (次小生成树变形)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4081

    Ch_Zaqdt
  • hbase 学习(十五)缓存机制以及可以利用SSD作为存储的BucketCache

      下面介绍Hbase的缓存机制:   a.HBase在读取时,会以Block为单位进行cache,用来提升读的性能   b.Block可以分类为DataBl...

    岑玉海
  • iOS block探究(一): 基础详解你要知道的block都在这里

    你要知道的block都在这里 转载请注明出处 https://cloud.tencent.com/developer/user/1605429 本文大纲 blo...

    WWWWDotPNG

扫码关注云+社区

领取腾讯云代金券