前端小白-----ES6之字符串模板
前言:只要坚持就会胜利--Coldfront-小白菜
既是总结也是一种分享
分享内容:ES6 字符串模板
案例1:var Musics=[{music:"六月的雨",singer:"胡歌",Album:"《六月的雨》"},{music:"认真",singer:"未知",Album:"《认真》"}]
window.onload=function(){
let ul1=document.querySelector("#ul1");
for(let i=0;i<Musics.length;i++){
let li1=document.createElement(" li ");
li1.innerHTML=`<span>歌曲:${Music[i].music} 歌手:${Musics[i].singer}专辑:${Musics[i].Album}<span/>`//ES6字符串模板
//li1.innerHTML="歌曲"+Musics[i].music+"歌手:"+Musics[i].music+"专辑"+Musics[i].Album; //传统的方式
ul1.appendChild(li1);
}
}

补充:一些内置的函数:startsWith(检测的东西);检测字符串需要检测的东西,如果检测有这个内容,返回true,否则返回false
前端小白-----ES6之字符串模板的更多相关文章
- 只为粗暴看一下ES6的字符串模板的性能
网上查找"ES6 字符串模板 +性能"5分钟无果遂写了一个暴力测试. 测试对象: +=方式,字符串累加计算方式 +s1+s2...+sn方式,即传统连加拼接字符串方式 s.push ...
- ES6中字符串模板的使用
反撇号(键盘上Tab键上面那个)基础知识 ES6引入了一种新型的字符串字面量语法,我们称之为模板字符串(template strings).除了使用反撇号字符代替普通字符串的引号 ‘ 或 ” 外,它们 ...
- ES6 学习 -- 字符串模板
ES5及以前,动态操作dom结构时,要多个字符串和变量拼接,如果不换行处理,则需要写很长的代码,不利于阅读理解,如果进行换行写入,则需要一堆的"+"号来连接文本与变量,写起来非常麻 ...
- es6字符串模板总结
我们平时用原生js插入标签或者用node.js写数据库语言时候,经常需要大量的字符串进行转义,很容易出错,有了es6的字符串模板,就再也不用担心会出错了 1.模板中的变量写在${}中,${}中的值可以 ...
- [js]es6语法: 字符串和数组的方法
s的方法 根据index取value: 取首尾项,arr[0], arr[arr.length-1] 根据value取index(判断是否包含子字符串): s.indexOf 栗子: 'maotai' ...
- ES6中的模板字符串和新XSS Payload
ES6中的模板字符串和新XSS Payload 众所周知,在XSS的实战对抗中,由于防守方经常会采用各种各样严格的过滤手段来过滤输入,所以我们使用的XSS Payload也会根据实际情况作出各种各样的 ...
- es6学习笔记--模板字符串
这几天简单看了一下深入浅出es6这本书,感觉特实用,学习了一个新特性---模板字符串在项目开发中,拼接字符串是不可缺少的,动态创建dom元素以及js操作数据都要拼接字符串,在es6出来之前,我们都通常 ...
- es6 入坑笔记(一)---let,const,解构,字符串模板
let 全面取代var 大概相似于C++的定义,一个变量必须得先定义后使用,没有预编译 注意let的作用域,一个{}就是一个作用域,上述规则须在一个作用于内 坑:for(let i =0;i < ...
- es6 中的 模板字符串
Template literals are string literals allowing embedded expressions. You can use multi-line strings ...
随机推荐
- Thrift源码分析(一)-- 基本概念
我所在的公司使用Thrift作为基础通信组件,相当一部分的RPC服务基于Thrift框架.公司的日UV在千万级别,Thrift很好地支持了高并发访问,并且Thrift相对简单地编程模型也提高了服务地开 ...
- PHPCMS快速建站系列之需要掌握的函数
路径:phpcms\libs\classes\model.class.php /** * 执行sql查询 * @param $where 查询条件[例`name`='$name'] * ...
- TCPThree_C杯 Day1
题解 或 正规题解 已经很详细,不再赘述. 跟着wjx打代码,不怕卡题. 忘开long long智障错误第四次左偏树
- easyUI + servlet 展示datagrid数据列表
1:在jsp页面添加所用easyUI的js和css 2.前台代码示例: <table id="dgObj" style="width: 100%;height:90 ...
- html5 拖放学习
html5拖放 需要有可拖放元素,可放置的位置(可多个),就像是一个苹果,多个箱子,苹果可以在箱子间来回放置,同样元素也可在多个可放置位置间来回拖放. 如果只有一个位置,元素只可被从原位置托放置唯一目 ...
- Xcode 中的Bundle versions string, short 和 Bundle version 区别
Bundle version is the internal version number of your app. Short version string is the publically vi ...
- UIView 判断是否visible
if(self.view == [(MyAppDelegate *)[[UIApplication sharedApplication] delegate].window.subviews objec ...
- axios细节之绑定到原型和axios的defaults的配置属性
把axios绑定到原型 vue开发者一套很好用的实践,一般来说,实践如果能够让大部分人都接受,会逐渐成为一个默认的标准. // 把axios配置到原型上 Vue.prototype.$axios = ...
- Codeforces Round #323 (Div. 2) Once Again... CodeForces - 582B 最长非下降子序列【dp】(不明白)
B. Once Again... time limit per test 1 second memory limit per test 256 megabytes input standard inp ...
- [HLSL]HLSL 入门参考 (dx11龙书附录B译文)
原文:[HLSL]HLSL 入门参考 (dx11龙书附录B译文) HLSL 高级着色语言 参考文档 龙书DirectX12现已推出中文版,其附录B的高级着色器语言参考的翻译质量比本文更高,有条件的读者 ...