一、字符串获取类，封装监测数字的方法
charAt()：根据下标返回字符串
charCodeAt()：根据下标返回字符串编码
String.fromCharCode()：根据编码值返回字符
在这里提一下主要字符的编码值：
0 ~ 9：48 ~ 57
a ~ z：97 ~ 122
A ~ Z：65 ~ 90
注意：若用charAt()监测一个不存在的字符，则返回值为空；即超出为空。
可用编码值来判断输入字符是否为数字
<body>
<input type="text" />
<input type="button" value="检测" />
<script>
var aInp = document.getElementsByTagName('input');
aInp[1].onclick = function () {
var val = aInp[0].value;
if ( detectNum(val) ) {
alert( '恭喜，'+ val +'全是数字' );
} else {
alert('输入有误');
}
};
function detectNum ( str ) {
var n = 0;
for ( var i=0; i<str.length; i++ ) {
n = str.charCodeAt(i);
if ( n<48 || n>57 )return false;
}
return true;
}
</script>
</body>
二、String.fromCharCode()返回字符串实例，字符串加密
可利用String.fromCharCode()函数能根据编码值返回字符的功能改变其编码值来进行加密
<body>
<input type="text" />
<input type="button" value="加密" />
<div id="div1">加密...</div>
<script>
var aInp = document.getElementsByTagName('input');
var oDiv = document.getElementById('div1');
aInp[1].onclick = function () {
var str = aInp[0].value;
var str1 = '';
for ( var i=0; i<str.length; i++ ) {
str1 += String.fromCharCode(str.charCodeAt(i)-520);
//该数字可根据自己喜好改变
}
oDiv.innerHTML = str1;
};
</script>
</body>
三、indexOf和lastIndexOf
indexOf：从左往右找
lastIndexOf：从右往左找
原始若要找一个字符在字符串所在的位置，则需要写循环
for ( var i=0; i<str.length; i++ ) {
if ( str.charAt(i) === 'i' ) {
alert(i);
}
}
而现在可利用函数进行查找
var str = 'www.miaov.com/2013ww';
alert( str.indexOf('m') );//4
str.indexOf('m', 5)//代表从第str[5]开始往后找 //12
alert( str.indexOf('X') ); //-1,返回-1表示没有找到
alert( str.indexOf('ww', 2) );//找到符合的之后，返回第一个w出现的位置//18
对于下面一段字符串，可用两种循环找到其位置
var str = '妙味课堂是一支独具特色的IT培训团队，妙味反对传统IT教育枯燥乏味的教学模式，妙味提供一种全新的快乐学习方法！';
var s = '妙味';
var i = 0;
法一,for
for( ; str.indexOf( s, i ) != -1 ; ){
alert( str.indexOf( s, i ) );
i = str.indexOf( s, i ) + s.length;
}
法二、while
while( str.indexOf( s, i ) != -1 ){
alert( str.indexOf( s, i ) );
i = str.indexOf( s, i ) + s.length;
}
同理对于lastIndexOf，只不过是字符串的右边往左找，返回的位置和从左往右的值是一样的
注意：如果第2个值为负数，默认当成0来处理
四、比较类，截取类，substring应用实例
字符串比较时，先比较第一个字符，再比较后边的字符
alert( 'abbbbb' > 'b' ); //false
alert( '10000' > '2' ); //false
alert( '10000' > 2 ); //true
substring截取字符串函数
var str = '妙味课堂是一支独具特色的IT培训团队';
alert( str.substring(0,2) ); //妙味
alert( str.substring(2,0) ); //妙味
注意：substring可以检测两个数，大的往后扔，小的往前扔
str.substring(0) == str.substring()//全部被截取
alert( str.substring(-3, 2) ); //妙味,-3当做0来处理
alert( str.substring(2, -3) ); //妙味
利用substring对段落文章的展开和收缩
<style>
p { border:10px solid #ccc; background:#FFC; width:400px; padding:20px; font-size:16px; font-family:微软雅黑; margin:40px auto 0; }
</style>
<script>
window.onload = function () {
var oP = document.getElementsByTagName('p')[0];
var oSpan = oP.getElementsByTagName('span')[0];
var oA = oP.getElementsByTagName('a')[0];
var str = oSpan.innerHTML;
var onOff = true;
oA.onclick = function () {
if ( onOff ) {
oSpan.innerHTML = str.substring(0, 18);
oA.innerHTML = '>>展开';
} else {
oSpan.innerHTML = str;
oA.innerHTML = '>>收缩';
}
onOff = !onOff;
};
};
</script>
</head>
<body>
<p><span>妙味课堂是一支独具特色的IT培训团队，妙味反对传统IT教育枯燥乏味的教学模式，妙味提供一种全新的快乐学习方法！<br />2013年底，妙味课堂最新推出“远程培训”服务，受到很多朋友们的喜爱与追捧，我们必将更加努力的帮助远程学习的朋友实现技术提升</span>……<a href="javascript:;">>>收缩</a></p>
</body>
slice()；也是字符串截取函数，但性质和substring有些差异
var str = '妙味课堂是一支独具特色的IT培训团队';
alert( str.slice( 0,2) ); //从0开始截取两个字符,即妙味
alert( str.slice( 2, 0 ) ); //无输出，即不交换位置
alert( str.slice( -4, -2 ) ); // 负数从后面倒着往前数（从头蹿到尾找），即培训
五、大小写转换，split()分割字符串
toUpperCase()：转成大写
toLowerCase()：转成小写
split()：分割字符串
var str = 'www.miaov.com';
var arr = str.split( '.' );//根据点进行分割
//arr = [ 'www', 'miaov', 'com' ];
var str1 = 'leo';
str1.split('') ; //根据单个字符进行分割
//str1 = [ 'l', 'e', 'o' ]
var str2 = '妙味课堂';
alert( str2.split('味') );//根据味进行分割
//str2 = [‘妙‘,’课堂‘]
var str3 = '/www.miaov.com/';
alert( str3.split('/')); //根据/分割
// [ , www.miaov.com, ]
var str4 = '2013-11-29-23-07';
alert( str4.split('-', 3) );
//根据-分割，但只保留数组前三位
六、高亮显示关键字实例，替换搜索关键字实例
join：将数组变为字符串
var arr = [ 'aa', 'bb', 'cc' ];
arr.join('+') // aa+bb+cc
arr.join('-') //aa-bb-cc
可利用join性质和split性质对文章段落进行查找,类似word文档一样
<body>
<input type="text" />
<input type="text" />
<input type="button" value="替换" />
<p>妙味课堂是一支独具特色的IT培训团队，妙味反对传统IT教育枯燥乏味的教学模式，妙味提供一种全新的快乐学习方法！<br />
2013年底，妙味课堂最新推出"远程培训"服务，受到很多朋友们的喜爱与追捧，我们必将更加努力的帮助远程学习的朋友实现技术提升……</p>
<script>
var aInp = document.getElementsByTagName('input');
var oP = document.getElementsByTagName('p')[0];
aInp[2].onclick = function () {
var str = aInp[0].value; // '妙味'
var newStr = aInp[1].value;
if (!str)return;
oP.innerHTML = oP.innerHTML.split(str).join('<span>'+newStr+'</span>');
};
</script>
</body>
