Javascript:数组和字符串的相互转化
中午吃饭的时候，和室友讨论前端的问题，然后一个有趣的问题被抛出来：
javascript用什么方法可以把“hello world”位置反转输出，即输出："dlrow olleh"?
听到这个问题，我的思路就是要把这个字符串分割成数组，因为数组里面有个常用的函数reverve()可以很好的实现反转效果，然后将分割成的数组拼接起来就ok啦；
背景知识：
1# split() 方法
将字符串分割为字符串数组，并返回此数组；
之前的总结：http://www.cnblogs.com/kevinCoder/p/4554960.html
Demo:
2# join() 方法
2.1:定义和用法
join() 方法用于把数组中的所有元素放入一个字符串。
元素是通过指定的分隔符进行分隔的。
2.2:语法
arrayObject.join(separator)
separator:可选。指定要使用的分隔符。如果省略该参数，则使用逗号作为分隔符。 返回一个字符串。该字符串是通过把 arrayObject 的每个元素转换为字符串，然后把这些字符串连接起来，在两个元素之间插入separator 字符串而生成的。
Demo:
3# reverse() 方法
reverse() 方法用于颠倒数组中元素的顺序。
语法arrayObject.reverse()，该方法会改变原来的数组，而不会创建新的数组。
===========开始干活=============
===========高亮显示关键字=============
通过上面的栗子，我们可以发现，原来split()和join()结合可以还原字符串原来的样子；
现在，我们做一些样式上的改变，即可完成高亮显示关键词的效果：
实现效果：
Code:
<!DOCTYPE html>
<html>
<head>
<title>搜索结果高亮显示</title>
<meta charset="utf-8"/>
<style type="text/css">
span{background-color: brown;color: #fff;border-radius: 3px;padding: 3px 5px;}
div{line-height: 1.8em;}
</style>
</head>
<body> <input type="text" id="txt" /><button id="btn">搜索</button> <div id="content">
<p>我没有说谎 我何必说谎<br/>
你懂我的 我对你从来就不会假装<br/>
我哪有说谎 请别以为你有多难忘<br/>
笑是真的不是我逞强</p>
</div> <script type="text/javascript"> var oTxt=document.getElementById('txt');
var oBtn=document.getElementById('btn');
var oContent=document.getElementById('content'); oBtn.onclick=function(){
var str=oTxt.value;//key words
if(!str)return;//不输入内容，返回
oContent.innerHTML=oContent.innerHTML.split(str).join('<span>'+str+'</span>');
} </script> </body>
</html>
Javascript:数组和字符串的相互转化的更多相关文章
- js数组的操作及数组与字符串的相互转化
数组与字符串的相互转化 <script type="text/javascript">var obj="new1abcdefg".replace(/ ...
- 舌尖上的javascript数组和字符串基本操作
Javascript数组基本操作 Javascript中的数组是一种特殊的对象,用来表示偏移量的索引是该对象的属性,索引可能是整数,然而这些数字索引在内部被转换为字符串类型,这是因为javascrip ...
- JavaScript 数组、字符串、Map、Set 方法整理
在线阅读 https://www.kancloud.cn/chenmk/web-knowledges/1080519 数组 isArray():Array.isArray(value) 用于检测变量是 ...
- Javascript 数组 数字 字符串 时间等使用
1．Javascript 数组API 1. //定义数组 2. var pageIds = new Array(); 3. pageIds.push('A'); 5. 数组长度 6. pageIds. ...
- js 数组与字符串的相互转化
数组转字符串:join() 字符串转数组:split('')
- JavaScript数组转字符串，字符串转数组
//--------------------数组转字符串--------------------------- //需要将数组元素用某个字符连接成字符串 var a1, b1,c1; a1 = [&q ...
- JavaScript数组与字符串常用方法总结
先来一段代码引子: var str='hello world'; alert(str.charAt());//通过下标查找值: alert(str.indexOf());//通过值查找字符串下标:没有 ...
- javascript数组与字符串之间转换
一.数组转字符串(将数组元素用某个字符连接成字符串) var a, b;a = new Array(0,1,2,3,4);b = a.join("-"); 二.字符串转数组(将字符 ...
- Javascript数组与字符串常用api
目录 javaScript(api学习) 数组有关的api 创建数组 数组的增删改查 indexOf(); push(),pop(),unshift(),shift() forEach() map() ...
随机推荐
- 基于jQuery仿uploadify的HTML5图片上传控件jquery.html5uploader
(function($){ var methods = { init:function(options){ return this.each(function(){ var $this = $(thi ...
- 如何使用css、布局横向导航栏
使用css布局横向导航栏,css应用给网页样式的方式,就相当于,给人怎么去穿上衣服,不同的衣服有不同的穿法,这里我们使用的是内联式.在这里 我们可以适当的把值调的大一点,这样我们就可以很容易的对比. ...
- C#中如何获取系统环境变量等
C#中获取系统环境变量需要用到Environment 类. 其中提供了有关当前环境和平台的信息以及操作它们的方法.该类不能被继承 以下代码得到%systemdrive%的值,即“C:” string ...
- telnet与tnsping
在cmd 下面 tnsping ZCGL ZCGL这个是在oracle做好的数据库连接. telnet IP地址 加上端口号. 查看视图的编写语句 select dbms_metadata.get_d ...
- Swift中的延迟加载(懒加载)
Swift方式的延迟加载 而在Swift中,你只需一行代码即可实现此机制: lazy var players = String[]() 简单.简洁,直入主题. 但你得记住,你必须使用var关键字来定义 ...
- php中bindValue的批量提交sql语句
php预编译sql语句,可以批量提交sql,也可以实现防注入 <?php $dsn='mysql:host=127.0.0.1;port=3306;dbname=bisai'; $usernam ...
- 解决使用angularjs时页面因为{{ }}闪烁的两种方式ng-bind,ng-cloak
1.HTML加载含有{{ }}语法的元素后并不会立刻渲染它们,导致未渲染内容闪烁(Flash of Unrendered Content,FOUC).我可以用ng-bind将内容同元素绑定在一起避免F ...
- restful风格的webservice开发之概念准备篇
理解restful:什么是rest,rest是Representational State Transfer的缩写,翻译过来就是“表现层状态转化”.这里有点不准确,其实rest省略了主语表现层指的是资 ...
- Ignatius and the Princess I
算法:搜索+优先队列+(递归输出结果) The Princess has been abducted by the BEelzebub feng5166, our hero Ignatius has ...
- javascript之闭包深入理解（二）
在上一节中,详细理解了作用域链和垃圾回收机制,似乎这两点跟闭包关系不大,但是仔细想一想就会发现,其实不然.这一节将通过上一部分的说明详细理解闭包.请看代码: function createCompar ...