字符串

7.17

一、字符串的处理方式

1.字符串str

str.length //获取它的长度

str.charAt(2) //获取传入下标处的字符，如果不传默认为”0“，超出时返回空

<script type="text/javascript">var str="Hello World!"document.write(str.length);//输出12document。write(str.charAt(1));//输出e</script>

str.charCodeAt(2) //获取传入下标处的Unicode 编码，不写默认为’0’

String.fromCharCode() //传入的编码值返回相应的字符，可以传多个编码，用’,’分割（静态方法，String不能少）

str.indexOf() //获取（）中在字符串中第一次出现的位置（可以一次找多个字符），未找到返回-1，第二个参数为开始位置（负数和不写默认是从0开始）

var index1 = a.indexOf("l");//index1 = 2var index2 = a.indexOf("l",3);//index2 = 3

lastIndexOf() //获取（）中在字符串中最后出现的位置（可以一次找多个字符），未找到返回-1，第二个参数为开始位置（负数是从0开始，不写默认从最后开始找）

str.substring() //截取从第一个参数到第二个参数（不包括第二个参数）的字符串，一个参数时截取到最后，会自动检测两个参数大小，按照从小到大的顺序截取，不写和负数默认从0开始

str.slice() //与上面方法类似，但是不会自动检测参数大小，负数从后向前找（最后一个为-1）

str.split(‘.’) //以.分割整个字符串并输出一个数组，即使什么参数都不传也会变成一个数据的数组，因此如果想把一个字符串每个字符分割，就传一个空字符串”，（注意：如果分隔符在左右，也会生成个空在数组里），第二个可选参数限制生成数组的长度（剩下的会被舍去）

<script type="text/javascript">var str="Hello World!"document.write(str.split(" "));//输出Hello,World!document.write(str.split(""));//输出H,e,l,l,o,W,o,r,l,d,!document.write(str.split(" ",1));//输出Hello"2:3:4:5".split(":")//将返回["2", "3", "4", "5"]"|a|b|c".split("|")//将返回["", "a", "b", "c"]</script>

arr.join(‘’) //split的反义词，把arr数组里的内容用‘’连接成字符串，生成一个所有数组组成的字符串，‘’里写什么每个数据中间就会用什么连接

str.toUpperCase() //把内容转换成大写

str.toLowerCase() //把内容转换成小写

二、ajax原理及应用

Ajax相当于在用户和服务器之间加了—个中间层,使用户操作与服务器响应异步化。并不是所有的用户请求都提交给服务器,像—些数据验证和数据处理等都交给Ajax引擎自己来做, 只有确定需要从服务器读取新数据时再由Ajax引擎代为向服务器提交请求。

ajax的异步传输是面向字符的传输，它的单位是字符；

同步传输是面向比特的传输，它的单位是桢，它传输的时候要求接受方和发送方的时钟是保持一致的。

①HTTP请求

过程：

HTTP请求方法：

GET：用于获取数据（如：浏览贴子）的默认方法，多用于查询，用url传递参数，外界可见。

POST：用于上传数据（如：用户注册），用于修改资源，

GET、POST的区别

get在url里传送数据：安全性低、容量小

post安全性一般、容量几乎无限

get便于分享（商品地址和url有关），适合获取，且会缓存

post更适合上传（图片等）

②XMLHttpRequest请求

方法一、open（method，url，async）:

method:发送请求方法（get\post）

url:请求地址（相对或者绝对）

async:请求异步（true）或者同步(false),默认异步

方法二、send(string)发送到服务器

get时参数不写或者null

post时参数必须填写

③XMLHttpRequest响应

属性

readystate属性：监听这个属性来判断事件是否响应完成，并取得成功

<script>    var request = new XMLHttpRequest();    request.open("GET","get.php",true);    request.send();    //监听    request.onreadystatechange = function(){        if(request.readyState===4&&request.status===200){            //do something  request.responseText        }    }</script>

④客户端的实现（其中有php的链接）

写一个记录员工姓名、性别、编号、职位，并有添加和保存的功能

<h1>员工查询</h1><label>请输入员工编号：</label><input type="text" id="keyword"/><button id="search">查询</button><p id="searchResult"></p><h1>员工新建</h1><label>请输入员工姓名：</label><input type="text" id="staffName"/><br><label>请输入员工编号：</label><input type="text" id="staffNumber"/><br><label>请输入员工性别：</label><select id="staffSex">    <option>男</option>    <option>女</option></select><br><label>请输入员工职位：</label><input type="text" id="staffJob"/><br><button id="save">保存</button><p id="createResult"></p>

<script>    document.getElementById("search").onclick = function(){        //发送ajax查询并处理        var request = new XMLHttpRequest();        request.open("GET","service.php?number="+document.getElementById("heyword").value);        request.send();        request.onreadystatechange = function(){            if(request.readyState===4){                if(request.status===200){                    document.getElementById("searchResult").innerHTML = request.responseText;                }else{                    alert("false:"+request.status);                }            }        }    }    document.getElementById("save").onclick = function(){        //发送ajax查询并处理        var request = new XMLHttpRequest();        request.open("POST","service.php");        var data = "name=" +document.getElementById("staffName").value                     +"&number=" +document.getElementById("staffNumber").value                     +"&sex=" +document.getElementById("staffSex").value                     +"&job=" +document.getElementById("staffJob").value;        request.send(data);        request.onreadystatechange = function(){            if(request.readyState===4){                if(request.status===200){                    document.getElementById("createResult").innerHTML = request.responseText;                }else{                    alert("false:"+request.status);                }            }        }    }</script>