replace(),indexOf(),substring(),split(),join(),——各种小知识点
1.replace ———— 实现去除指定字符串功能,可以用空字符串代替,也可以去新字符代替已有的字符。
var str="123_z.jpg";
str=str.replace("_z","");
console.log(str) //123.jpg
var str="admin#mary#jim";
console.log(str.replace(/#/g,",")); //admin,mary,jim 全局替换
2.indexOf() —— 可返回某个指定的字符串值在字符串中首次出现的位置,如果要检索的字符串值没有出现,则该方法返回 -1。
var str="123_z.jpg";
var newStr = str.indexOf("_z");
console.log(newStr); //
lastIndexOf() —— 可返回一个指定的字符串值最后出现的位置,在一个字符串中的指定位置从后向前搜索,同indexOf一样,如果检索的字符串没有出现,则该方法返回-1。
var str="Administrators";
console.log(str.lastIndexOf("s")); //
var str="Administrators";
console.log(str.lastIndexOf("2")); // -1
3.substring() —— 用于截取字符串中介于两个指定下标之间的字符。
语法:stringObject.substring(start,stop)
start : 必需;
stop : 可选,不填则默认为到结束位置;
substring() 方法返回的子串包括 start 处的字符,但不包括 stop 处的字符。
var str="123_z.jpg";
var newStr = str.substring(3);
console.log(newStr); // _z.jpg
substr() —— 可在字符串中抽取从 start 下标开始的指定数目的字符 substr() 的参数指定的是子串的开始位置和长度,因此它可以替代 substring() 和 slice() 来用
语法:stringObject.substr(start,length)
start:必需;如果是负数,那么该参数声明从字符串的尾部开始算起的位置。也就是说,-1 指字符串中最后一个字符,-2 指倒数第二个字符,以此类推。length:可选,不填则默认为到结束位置
4.split() —— 用于把一个字符串分割成字符串数组。
数据库(img)字段保存的数据类型是这样的:
/images/feedback/2016/11/03/201611031513169266_Z.jpg,/images/feedback/2016/11/03/201611031513169266.jpg|
/images/feedback/2016/11/03/201611031513169497_Z.jpg,/images/feedback/2016/11/03/201611031513169497.jpg|
/images/feedback/2016/11/03/201611031513169997_Z.jpg,/images/feedback/2016/11/03/201611031513169997.jpg|
/images/feedback/2016/11/03/201611031513207863_Z.jpg,/images/feedback/2016/11/03/201611031513207863.jpg
想要的效果:以"_Z"结尾的为压缩后的图片,没有"_Z"的则为原图,需要正常显示缩略图,点击缩略图的时候显示原图,于是乎:
var imgArr=img.split("|");//原图以及缩略图 将字符串分割成——>字符串数组
for(var i=0,len=imgArr.length;i<len;i++){
// 压缩的图片路径
contents+='<img src="'+imgsite+apiImgsite+imgArr[i].split(',')[0]+'" bigImg="'+imgsite+apiImgsite+imgArr[i].split(',')[1]+'" style="width: 150px;height: 100px;margin-left: 20px" onclick="openImg(this)">';
}
contents=contents+'</div>';
}
function openImg(me){
var bigImg = jQuery(me).attr("bigImg");//缩略图路径
window.open(bigImg);
}
之前,自己出现比较Low的bug就是:一直以为点击img标签的时候,只有src属性,而自己却不知道怎么通过"_Z"的路径得到原图的路径,也不知道给img标签添加另外一个自定义属性,于是就直接用replace()将其中的"_Z"替换掉,这样就被同事嘲笑很Low了,因为一旦保存在数据库的数据改成"_z"时,自己显示原图的目标就实现不了,经过大神同事的指点,就在里面添加一个"bigImg"属性,这样便可以实现点击缩略图看原图的效果了。
5.splice(index,len,[item]) —— 用来替换、删除、添加数组内某一个值或者几个值
index ——> 数组开始的下标 len ——> 替换/删除的长度 item —— > 替换的值,删除操作的话item值为空
如:arr = ["a","b","c","d"];
删除:
arr.splice(1,1) //['a','c','d'] 删除起始下标为1,长度为1的一个值,len设置的1,如果为0,则数组不变 arr.splice(1,2) //['a','d'] 删除起始下标为1,长度为2的一个值,len设置的2
替换:
arr.splice(1,1,'ttt') //['a','ttt','c','d'] 替换起始下标为1,长度为1的一个值为‘ttt’,len设置的1 arr.splice(1,2,'ttt') //['a','ttt','d'] 替换起始下标为1,长度为2的两个值为‘ttt’,len设置的1
添加:len设置为0,item为添加的值
arr.splice(1,0,'ttt') //['a','ttt','b','c','d'] 表示在下标为1处添加一项'ttt'
6.join() —— 用于把数组中的所有元素放入一个字符串 元素是通过指定的分隔符进行分隔的。
var arr = ["mary","bob","jim","sum"];
console.log(arr.join("-")); // mary-bob-jim-sum
replace(),indexOf(),substring(),split(),join(),——各种小知识点的更多相关文章
- Java学习过程中的总结的小知识点(长期更新)
Java学习过程中的总结的小知识点 (主要是自己不会的知识和容易搞错的东西) 计算某个程序运行的时间 long stime=System.currentTimeMillis(); copy3(file ...
- linux系统下用到的小知识点积累
preface:在ubuntu下做事情,在终端下执行一些命令.或者在vim里面做一些操作.自然而然须要用到一些小知识点,没有怎么系统地看<鸟哥的菜>,基本上是遇到了什么问题想要实现什么功能 ...
- 刚接触Linux,菜鸟必备的小知识点(一)
身为一个将要大四的学生,而且还是学计算机的没有接触过linux简直是羞愧难当.这个假期做了一个软件测试员,必须要熟悉linux的操作,所以对于我这个菜鸟我也就说几点比较重要的小知识点吧. 第一.cd指 ...
- 【转】HTML5的小知识点小集合
html5的小知识点小集合 html5知识 1. Doctype作用?标准模式与兼容模式各有什么区别? (1).<!DOCTYPE>声明位于位于HTML文档中的第一行,处于<h ...
- AngularJS的小知识点
小知识点:$scope和$rootScope (1)每次使用ngController指令,都会调用控制器的创建函数,创建出一个控制器对象. (2)每次创建一个控制器对象,AngularJS都会创建一个 ...
- js中关于value的一个小知识点(value既是属性也是变量)
今天在学习input的value值时,发现这么一个小知识点,以前理解不太透彻. [1]以下这种情况是常见情况,会弹出“测试内容” <input type="button" v ...
- html5的小知识点小集合
html5的小知识点小集合 html5知识 1. Doctype作用?标准模式与兼容模式各有什么区别? (1).<!DOCTYPE>声明位于位于HTML文档中的第一行,处于< ...
- [BS] 小知识点总结-05
[BS] 小知识点总结-05 1. 不论UIWindow的rootViewController是navC.tabBarC还是VC,也不管modalVC和rootVC中间隔着多少个VC,但是modal出 ...
- 一个关于echo的小知识点
一个关于echo的小知识点 echo一个布尔值时,如果是true,输出1,而如果是false,将什么都不输出! 网上搜的一个解释: 对于数字类型来说,false 确实 是 0, 而对strin ...
随机推荐
- [JAVA设计模式]第一部分:接口、抽象类、设计原则
声明:原创作品,转载时请注明文章来自SAP师太技术博客( 博/客/园www.cnblogs.com):www.cnblogs.com/jiangzhengjun,并以超链接形式标明文章原始出处,否则将 ...
- SQL生成包含年月日的流水号
--************************************************************************************************** ...
- 虚拟机guest为windows7的环境下安装破解版simplify3d_3.0.2
情形: 1.主机(host):ubuntu 2.虚拟机里安装的操作系统版本(guest):windows 7专业版 3.simplify3d破解版版本:3.0.2(破解需要的工具均在下文的百度云地址里 ...
- eclipse 实用快捷键
Ctrl+E: 弹出输入窗口,可快速返回想返回的目标界面 Ctrl+Shift+O: 快速import包 Ctrl+O:显示类中方法和属性的大纲 Ctrl+1 快速修复 Ctrl+Alt+↓ 复制当前 ...
- GitHub上不错的Android开源项目(二)
收集相关系列资料,自己用作参考,练习和实践.小伙伴们,总有一天,你也能写出 Niubility 的 Android App :-) 系列文章如下: GitHub上不错的Android开源项目(一):h ...
- MYSQL 表级锁 行级锁 页面锁区别
myisam存储引擎默认是表级锁 innodb存储引擎默认是行级锁 DBD存储引擎默认是页面锁 表级锁:开销小,加锁快:不会出现死锁:锁定粒度大,发出锁冲突的概率最高,并发度最低.行级锁:开锁大, ...
- 动态CSS--less
忙了很久终于有时间来写点东西了,不知道大家有没有发现,我们在写CSS的时候总是在重复很多代码,一个相同的属性值往往要重复N次,以前我就经常想有没有什么办法能让我们不用一直重复的font-size啊co ...
- javascript获取类元素
代码测试是ie5+: 原生javascript中筛选出含有指定类的元素: 思想:在指定范围里把所有的元素筛选出来,然后把里面的每个元素都遍历找出它们含有的所有类,然后逐个元素遍历它们各自的类,如果指定 ...
- mysql中替换行首字符
替换行首字符,而不替换字段中其它地方指定字符. UPDATE table SET open_time = CONCAT('W', open_time) WHERE open_time REGEXP ' ...
- IQ一个人的智力和对科学知识的理解掌握程度。 EQ对环境和个人情绪的掌控和对团队关系的运作能力。 AQ挫折商 一个人面对困境时减除自己的压力、渡过难关的能力。
IQ: Intelligence Quotient 智商 一个人的智力和对科学知识的理解掌握程度. EQ: Emotional Quotient 情商 一个人对环境和个人情绪的掌控和对团队关系的运作能 ...