8-1 对象习题表单验证
1、对象习题
1、将字符串str = “When I was young, I love a girl in neighbor class.”中,从young提取到girl生成新字符串。但是不许数
var str = "When I was young, I love a girl in neighbor class.";
//1、找出位置
var start = str.indexOf("young");
var end = str.indexOf("girl") + "girl".length;
var subStr = str.substring(start, end);
alert(subStr);
2、将字符中单词用空格隔开
已知传入的字符串中只有字母,每个单词的首字母大写，请将每个单词用空格隔开，只保留一个单词的首字母大写
传入:”HelloMyWorld”
返回:”Hello my world”
/*
split() 将字符串 -> 数组 通过字符串分割的方式
*/
/*var str = "HelloMyWorld";
var arr = str.split("");
// alert(arr);
// H,e,l,l,o, ,m,y, ,w,o,r,l,d
//从头到尾遍历，找大写字母。将其改成小写，并且在这个位置插入空格。
for(var i = 1; i < arr.length; i++){
if(arr[i] >= "A" && arr[i] <= "Z"){
arr[i] = arr[i].toLowerCase();
arr.splice(i, 0, " ");
}
}
alert(arr.join(""));*/
/*
function wordFromStr(str){
var arr = str.split("");
for(var i = 1; i < arr.length; i++){
if(arr[i] >= "A" && arr[i] <= "Z"){
arr[i] = arr[i].toLowerCase();
arr.splice(i, 0, " ");
}
}
return arr.join("");
}
alert(wordFromStr("HelloMyWorld"));*/
3、.已知一个字符串对象中，英语单词用各种非字母字符分割，统计单词的个数
传入: “Yes,she**is%%my@love.”
单词判断的标准
前一个字符是字母，后一个字符是非字母
function countOfWord(str){
var count = 0; //用于计数
for(var i = 0; i < str.length - 1; i++){
if(isABC(str[i]) == true && isABC(str[i + 1]) == false){
//这就是一个单词
count++;
}
}
return count;
}
alert(countOfWord("Yes,she**is%%my@love."));
//判断一个字符是否是字母
function isABC(charStr){
if(charStr >= "A" && charStr <= "Z" || charStr >= "a" && charStr <= "z"){
return true;
}else{
return false;
}
}
2、onblur
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
/*
光标获取 获取焦点
光标离开 失去焦点
*/
</script>
</head>
<body>
<input type="text" id = "input1" />
</body>
<script>
var oInput = document.getElementById("input1");
/*
失去焦点函数
*/
oInput.onblur = function(){
alert("失去焦点");
}
</script>
3、表单验证
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
#login{
width: 400px;
height: 200px;
background-color: orange;
border: 1px solid black;
text-align: center;
padding: 20px;
margin: 100px auto;
}
#login input{
margin-top: 10px;
width: 280px;
height: 22px;
font-size: 15px
}
</style>
</head>
<body>
<div id = "login">
<input id = "username" type="text" placeholder="用户名" />
<br/ >
<span id = "username_span">6~18个字符，可使用字母、数字、下划线</span><br />
<input id = "password" type="text" placeholder="密码" />
</div>
</body>
<script>
var oUsername = document.getElementById("username");
var oUsername_span = document.getElementById("username_span");
//失去焦点的时候。判断是否正确
oUsername.onblur = function(){
// 1、如果误输入空格，自动纠错 / /g 全局匹配空格
oUsername.value = oUsername.value.replace(/ /g, "");
var oValue = oUsername.value;
// 2、字符串长度必须是6~18位
if(oValue.length > 18 || oValue.length < 6){
oUsername_span.innerHTML = "长度应为6~18个字符";
//设置颜色为红色
oUsername_span.style.color = "red";
}else if(oValue[0] >= "0" && oValue[0] <= "9"){
oUsername_span.innerHTML = "首字母不能为数字";
//设置颜色为红色
oUsername_span.style.color = "red";
}else{
//整个邮箱都必须符合数字字母下划线
//dada.dadad
var isTrue = false; // 没有不符合条件的
for(var i = 0; i < oValue.length; i++){
//一个一个去判断，如果有一个不符合条件，提示错误
if(isEmailRule(oValue[i]) == false){
isTrue = true;
break;
}
}
if(isTrue){
oUsername_span.innerHTML = "只能由数字、字母、下划线组成";
oUsername_span.style.color = "red";
}else{
oUsername_span.innerHTML = "符合要求";
oUsername_span.style.color = "green";
}
}
}
//判断一个字符，是否是数字、字母、下划线
function isEmailRule(charStr){
if(charStr >= "a" && charStr <= "z" || charStr >= "A" && charStr <= "Z" || charStr >= "0" && charStr <= "9" || charStr == "_"){
return true;
}else{
return false;
}
}
/*
密码： 1、长度 2、两次输入一致
*/
</script>
4、字符串作业
/*
1.将字符串按照单词进行逆序，空格作为划分单词的唯一条件
传入:”Welome to Beijing”改为 “Beijing to Welcome”
*/
function reverseStr(str){
var arr = str.split(" ");
arr.reverse();
return arr.join(" ");
}
/*var str = reverseStr("Welome to Beijing");
alert(str);*/
/*
2.对称数组
传入一个数组，起元素类型与个数皆未知，返回新数组，
由原数组的元素正序反序拼接而成
传入[“One”, “Two”,”Three”]
返回[“One”, “Two”, “Three”,”Three”,”Two”, “One”]
*/
function symmetryArr(arr){
//生成新数组
var newArr = arr.concat();
for(var i = arr.length - 1; i >= 0; i--){
newArr.push(arr[i]);
}
return newArr;
}
// alert(symmetryArr(["one", "two", "three"]));
/*
3.实现函数，查找子串出现的次数，返回字符串str中出现substring的次数
传入:”abcabcabc”, “abc”
返回:3
*/
/*
supStr.indexOf(subStr, 0);
supStr.indexOf(subStr, 3);
supStr.indexOf(subStr, 6);
supStr.indexOf(subStr, 9);
*/
function countOfStr(supStr, subStr){
var start = 0;
var count = 0;
while(1){
start = supStr.indexOf(subStr, start);
if(start == -1){
break;
}
count++;
start = start + subStr.length;
}
return count;
}
alert(countOfStr("abcabcabc", "abc"));
/*
4.已知千峰邮箱的用户名只能由数字字母下划线组成，域名为@1000phone.com,判断一个字符串是否是千锋邮箱，是返回true，不是返回false。
mail@1000phone.com 是
$mail@1000phone.com 不是
mail@1000phone.comp 不是
*/
function isEmail(email){
//1、将末尾的14个字符，提取，判断是否是@1000phone.com
var lastStr = email.substring(email.length - 14, email.length);
if(lastStr != "@1000phone.com"){
return false;
}else{
var arr = email.split("@");
var username = arr[0];
var count = 0; //记录有几个非法字符
//判断用户名 只能由数字字母下划线组成
for(var i = 0; i < username.length; i++){
if(isEmailRule(username[i]) == false){
count++;
}
}
if(count == 0){
return true;
}else{
return false;
}
}
}
var res = isEmail("mail@1000phone.com");
alert(res);
//判断一个字符，是否是数字、字母、下划线
function isEmailRule(charStr){
if(charStr >= "a" && charStr <= "z" || charStr >= "A" && charStr <= "Z" || charStr >= "0" && charStr <= "9" || charStr == "_"){
return true;
}else{
return false;
}
}
</script>
