位置: IT常识 - 正文

js模板字符串(Js模板字符串添加点击事件)

编辑:rootadmin
js模板字符串 js模板字符串模板字符串(模板字面量)在模板字符串中插入变量在模板字符串中插入表达式模板字符串中可以换行模板字符串中可以调用函数模板字符串支持嵌套使用模板字符串(模板字面量)

推荐整理分享js模板字符串(Js模板字符串添加点击事件),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:Js模板字符串拼接,js模板字符串添加换行,js模板字符串添加换行,js模板字符串的使用方法,js模板字符串的使用方法,js模板字符串添加换行,js模板字符串换行,Js模板字符串拼接,内容如对您有帮助,希望把文章链接给更多的朋友!

ES6 中引入了模板字符串,让我们省去了字符串拼接的烦恼。下面一起来看看它的特性。

在模板字符串中插入变量

以前,让字符串进行拼接的时候,是这样做的:(传统写法的字符串拼接)

var name = 'smyhvae';var age = '26';console.log('name:' + name + ',age:' + age); //传统写法

这种写法,比较繁琐,而且容易出错。

现在,有了 ES6 语法,字符串拼接可以这样写:

var name = 'qianguyihao';var age = '26';console.log('我是' + name + ',age:' + age); //传统写法console.log(`我是${name},age:${age}`); //ES6 写法。注意语法格式

注意,上方代码中,倒数第二行用的符号是单引号,最后一行用的符号是反引号(在 tab 键的上方)。

参考链接:

ES6 的 rest 参数和扩展运算符在模板字符串中插入表达式js模板字符串(Js模板字符串添加点击事件)

以前,在字符串中插入表达式的写法必须是这样的:

const a = 5;const b = 10;console.log('this is ' + (a + b) + ' and\nnot ' + (2 * a + b) + '.');

现在,通过模板字符串,我们可以使用一种更优雅的方式来表示:

const a = 5;const b = 10;// 下面这行代码,故意做了换行。console.log(`this is ${a + b} andnot ${2 * a + b}.`);

打印结果:

this is 15 andnot 20.模板字符串中可以换行

因为模板字符串支持换行,所以可以让代码写得非常美观。

代码举例:

const result = { name: 'qianguyihao', age: 28, sex: '男',};// 模板字符串支持换行const html = `<div><span>${result.name}</span><span>${result.age}</span><span>${result.sex}</span></div>`;console.log(html); // 打印结果也会换行

打印结果:

模板字符串中可以调用函数

模板字符串中可以调用函数。字符串中调用函数的位置,将会显示函数执行后的返回值。

举例:

function getName() { return 'qianguyihao';}console.log(`www.${getName()}.com`); // 打印结果:www.qianguyihao.com模板字符串支持嵌套使用const nameList = ['千古壹号', '许嵩', '解忧少帅'];function myTemplate() { // join('') 的意思是,把数组里的内容合并成一个字符串 return `<ul>${nameList.map((item) => `<li>${item}</li>`).join('')}</ul>`;}document.body.innerHTML = myTemplate();

效果如下:

本文链接地址:https://www.jiuchutong.com/zhishi/300104.html 转载请保留说明!

上一篇:CSS响应式布局(自适应布局)(css响应式布局插件)

下一篇:chatgpt 的真正用法,你真的会用吗(chatto)

  • 苹果13手机怎么实现长截屏或滚动截屏功能吗(苹果13手机怎么截屏 截图方法)

    苹果13手机怎么实现长截屏或滚动截屏功能吗(苹果13手机怎么截屏 截图方法)

  • 苹果qq来消息不提醒(苹果qq来消息不通知)

    苹果qq来消息不提醒(苹果qq来消息不通知)

  • 遮挡权限请求怎么关闭(遮挡权限请求怎么关闭oppo)

    遮挡权限请求怎么关闭(遮挡权限请求怎么关闭oppo)

  • vivox21能开空调吗(vivox21可不可以开空调)

    vivox21能开空调吗(vivox21可不可以开空调)

  • 为什么华为手机连不上wifi(为什么华为手机突然黑屏然后按开机键都不显示)

    为什么华为手机连不上wifi(为什么华为手机突然黑屏然后按开机键都不显示)

  • kindle新机开不了机(kindle开不了机)

    kindle新机开不了机(kindle开不了机)

  • ipadmini5屏幕刷新率(ipad2020屏幕刷新率)

    ipadmini5屏幕刷新率(ipad2020屏幕刷新率)

  • b站画面卡住有声音(b站视频画面卡住)

    b站画面卡住有声音(b站视频画面卡住)

  • 上网账号和上网口令是什么(上网账号和上网口令怎么获得)

    上网账号和上网口令是什么(上网账号和上网口令怎么获得)

  • 荣耀v30发热严重怎么办(荣耀v30发热严重怎么回事)

    荣耀v30发热严重怎么办(荣耀v30发热严重怎么回事)

  • 蓝牙键盘怎么充电(蓝牙键盘充一次电能用多久)

    蓝牙键盘怎么充电(蓝牙键盘充一次电能用多久)

  • 摄像头清晰度1080p和3mp区别(摄像头清晰度1080p是什么意思)

    摄像头清晰度1080p和3mp区别(摄像头清晰度1080p是什么意思)

  • 光路认证失败什么意思(光路认证失败什么原因)

    光路认证失败什么意思(光路认证失败什么原因)

  • 恢复已关闭的网页快捷键(如何恢复已经关闭的网页)

    恢复已关闭的网页快捷键(如何恢复已经关闭的网页)

  • iphone6plus截图怎么截(苹果截图6splus)

    iphone6plus截图怎么截(苹果截图6splus)

  • 苹果手机外放音量小怎么办(苹果手机外放音质)

    苹果手机外放音量小怎么办(苹果手机外放音质)

  • ssl协议要开启吗(ssl协议不开启后果)

    ssl协议要开启吗(ssl协议不开启后果)

  • 微信能看到对方在线吗(微信能看到对方撤回的消息吗)

    微信能看到对方在线吗(微信能看到对方撤回的消息吗)

  • 刷脸支付怎么关闭(怎么关闭刷脸支付功能)

    刷脸支付怎么关闭(怎么关闭刷脸支付功能)

  • 新版微信的支付中心在哪(新版微信的支付管理在哪里设置)

    新版微信的支付中心在哪(新版微信的支付管理在哪里设置)

  • 小度在家有几个版本(小度在家几个型号有什么区别)

    小度在家有几个版本(小度在家几个型号有什么区别)

  • 在线网速测试需要注意哪几点?(在线网速测试需要付费吗)

    在线网速测试需要注意哪几点?(在线网速测试需要付费吗)

  • 不符合Win11硬件标准如何照样升级Win11?(不符合win11硬件要求安装会怎么样)

    不符合Win11硬件标准如何照样升级Win11?(不符合win11硬件要求安装会怎么样)

  • 西西伯利亚森林中的阳光,俄罗斯拉杜日内市附近 (© Leonid Ikan/Shutterstock)(在西伯利亚森林中是真实故事吗)

    西西伯利亚森林中的阳光,俄罗斯拉杜日内市附近 (© Leonid Ikan/Shutterstock)(在西伯利亚森林中是真实故事吗)

  • 在windows下安装nnUnet,并制作数据集以及运行(让隔壁奶奶也能学会的教程)(在windows中安装应用程序的途径)

    在windows下安装nnUnet,并制作数据集以及运行(让隔壁奶奶也能学会的教程)(在windows中安装应用程序的途径)

  • 个人所得税是什么意思有什么用
  • 2023年小规模物业公司物业费税率
  • 行政职工福利费包括哪些内容呢
  • 租金营改增
  • 航空公司开具的个人抬头的发票可以税前扣除吗
  • 长期股权投资是金融资产还是非金融资产
  • 一次性就业补助金的领取条件
  • 个人独资企业租赁收入如何纳税
  • 私人口腔诊所会感染艾滋病吗
  • 转账支票存根联图片
  • 增值税专用发票抵扣期限
  • 属于会计核算方法的
  • 企业库存现金的限额是由( )核定的
  • 发票抬头开错重开怎么处理?
  • 已抵扣进项怎么转出
  • 个人所得税申报退税的条件
  • 工行代收资金清算过渡户是什么?
  • 代理进口货物怎么做账
  • 未退还的保证金怎么处理
  • 公司商品房出售流程
  • 苹果电脑安装中国银行控件用不了
  • 在幻灯片中导入视频文件后视频文件时被几个圆点框选
  • 年度利润总额是会计利润吗
  • 票据质押出票如何操作
  • 企业出售自用车账务处理
  • 出纳现金管理的目标与方法
  • qdcsfs.exe - qdcsfs是什么进程 有何作用
  • PACKAGER.EXE - PACKAGER是什么进程 有什么用
  • 新成立的公司要年报吗?
  • 开发产品完工结转
  • laravel dump
  • 换出长期股权投资的会计处理
  • c++~怎么用
  • 分支机构可以不分配所得税吗?
  • php 字符串处理函数
  • 悬崖徒步
  • javascript基础类型
  • 出口退税备案是代理的需要主办会计身份证复印件吗
  • 企业账户对私人账户转账多久到账
  • 个人转让上市公司原始股
  • 运费已付发票未到会计分录
  • python如何运行
  • 什么叫一般
  • 企业跨区变更地址需要多久
  • 金税四期查到了怎么办
  • 研发人员工资加计扣除以实发
  • 长期待摊费用在注会哪一章
  • 坏账准备是资产减值损失吗
  • 收到银行开的手续费发票如何做帐
  • 应付账款属于外币货币性项目吗
  • 工程施工科目下可以设置咨询费吗
  • 出差发生的招待费计入差旅费吗
  • 设备升级是什么意思
  • 发放工资时社保为什么计入其他应付款科目
  • 销售收入确认后怎么处理
  • 社保账务如何做会计分录
  • 什么服务费发票可以免税的
  • 企业应付职工薪酬增加说明什么
  • 新增注册资金
  • mysql服务1053
  • Linux下Mysql5.7.19卸载方法
  • centos6yum源
  • grub rescue修复引导找不到grub
  • windows下怎么安装mac
  • win8开机启动
  • 在cenots下使用iso光盘文件重新安装CentOS的方法步骤
  • windows8.1的设置在哪
  • 开发环境配置是干嘛
  • js判断手机号
  • bootstrap怎么学
  • jquery操作dom
  • linux中shell脚本编写
  • jQuery对checkbox 复选框的全选全不选反选的操作
  • 技术开发类工作有哪些
  • python直接访问私有属性的简单方法
  • jquery datatable排序
  • 税务投诉撤销申诉
  • 黑龙江电子税务局app手机
  • 中国进口车关税为什么那么贵
  • 跨区域涉税事项报告表
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设