表单事件

以下为表单实例。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <form action="" method="post" id=login>
        <label for="email" class="title">用户登录</label>
        <label for="email">邮箱</label>
        <input type="text" onblur="check(this)" name="email" class="email" placeholder="请输入邮箱">
        <label for="password">密码</label>
        <input type="password" onblur="check(this)" name="password" class="password" placeholder="请输入8位数得密码">
        <button>提交</button>
    </form>
    <script>
            function check(ele){
                event.preventDefault();
                event.stopPropagation();
                let act = document.activeElement.name;
                if (act==="email")
                {
                    return false;
                }
                if (act=="password")
                {
                    return false;
                }
                let parent=ele.form;
                console.log(ele.value);
                if (parent.email.value.length==0)
                {
                    alert("邮箱不能为空");
                    parent.email.focus();
                    return false;
                }
                else if(parent.password.value.length==0)
                {
                    alert("密码不能为空");
                    parent.password.focus();
                    return false;
                }
                else{
                    alert("验证通过");
                    return true;
                }
            }
    </script>
</body>
</html>

javascript数组常用api

字符串数组

1.length获取长度str.length
2.charAt通过索引元素str.charAt(0)
3.indexof通过元素获得索引str.indexof("中")
4.serch通过元素获得索引,但是支持正则表达式
5.concat字符串拼接str.concat("a","bcs")
6.replace替换字符串str.replace("中文网",".cn")
7.slice(a,b)取a到B得子串str.slice(0,3)
8.substr(0,num)取子串从第0个字符开始取num个字符str.substr(0,5)
9.split(“a”,num)分割字符串,第一个参数不为空时,跟你a字符分割字符串,返回字符串数组,第一个参数为空,第二个不为空时,返回前n个字符数组
10.tolowercase()将字符串全部转成小写str.tolowercase()
11.toUppercase()将字符串全部转成大写str.toUppercase()
其他数组
Array.of 原始数据有可能来自一个外部请求api或文件,而这个原始数据就是数组例

    let a=[1,2,3,4,5];
    arr=Array.of(...a);
    console.log(arr);

Array.from将类数组转成数组例

   const likeArr = {
        0: "red",
        1: "blue",
        2: "green",
        length: 3,
      };
      console.log(likeArr);
      console.log(Array.from(likeArr));

push,从数组尾部加入arr.push(10)
pop，从数组尾部删除arr.pop(20)
unshift从数组头部加入arr.unshift(10)
shift从数组头部删除arr.shift()
forEach((item,index,arr)=>{…}), 每个元素逐个调用回调处理,item是必须,foreach没有返回值例子如下

       let arr = [1, 2, 3, 4, 5];
let res = arr.forEach(function (item, index, arr) {
  // 三个参数中, 只有第一个 item是必须的
  console.log(item, index);
  // dom
  document.body.append(item);
});

map: 参数与功能与forEach一样,只不过有返回值,返回值是新数组

 res = arr.map(item => item * 2);
      console.log(res);

every断言函数,判断数组中每个值是否符合条件,全部符合返回true，否则返回falseconsole.log(arr.every(item => item >= 0));
some: 数组成员中只要有一个满足条件,就返回 true, 否则 false,console.log(arr.some(item => item >= 10));
filter: 返回数组中的满足条件的元素组成的新数组console.log(arr.find(item => item >= 3));
reduce: 归并

   res = arr.reduce(function (acc, cur, index, arr) {
        console.log("acc=", acc, "cur=", cur, "index=", index, "arr=", arr);
        // 最终结果用 acc 返回, acc累加器
        return acc + cur;
      }, 5);

sort排序升序console.log(arr.sort((a, b) => a - b));,降序console.log(arr.sort((a, b) => b - a));
join将数组转成字符串

 arr = ["red", "green", "blue"];
      console.log(arr.join());
      console.log(arr.join("-"));

slice子元素

 arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
      console.log(arr.slice(2, 5));
      console.log(arr.slice(2));
      console.log(arr.slice(-6, -3));

splice: 删除, 新增, 替换

 // delete
      console.log(arr);
      console.log(arr.splice(1, 2));
      console.log(arr);
      // update
      console.log(arr.splice(1, 2, "a", "b"));
      console.log(arr);
      // insert
      console.log(arr.splice(1, 0, "red", "green"));
      console.log(arr);
      let data = ["red", "green", "blue"];
      console.log(arr.splice(1, 0, ...data));
      console.log(arr);

批改老师：

PHPz

批改状态：合格

老师批语：

本博文版权归博主所有，转载请注明地址！如有侵权、违法，请联系admin@php.cn举报处理！

全部评论文明上网理性发言，请遵守新闻评论服务协议

0条评论

作者最新博文

浅谈HTML开发基础

2021-12-22 17:30:06

表单事件

javascript数组常用api

字符串数组

其他数组