zoukankan      html  css  js  c++  java
  • 原生js常用

    1, js数组去重的方法

    //第一种
    function unique(ary){
    var obj={};
    for(var i=0;i<ary.length;i++){
    var cur = ary[i];
    if(obj[cur] == cur){
    ary[i] = ary[ary.length-1];
    ary.length--;
    i--;
    }
    obj[cur] = cur;
    }
    return ary;
    }
    console.log(unique([2,3,2,4,3,5,6,1,1]));
    //第二种
    function unique(ary){
    var arr1 = [];
    var obj = {};
    for(var i=0;i<ary.length;i++){
    if(!obj[ary[i]]){
    arr1.push(ary[i]);
    obj[ary[i]] = 1;

    }
    }
    return arr1;
    };
    var arr = [3,1,1,2,2,3,3,4,4];
    console.log(unique(arr));

     2、js类数组(arguments,dom元素集合)转化为数组

    let arrayLike = {
    '0' : 'a',
    '1' : 'b',
    '2' : 'c',
    length : 3
    };
    1、Array.prototype.slice.call()
    利用数组slice的方法实现
    let arr1 = Array.prototype.slice.call(arrayLike);
    2、[].slice.call();
    let arr2 = [].slice.call(arrayLike);
    3、Array.from()
    ES6新增的转换数组的方法
    let arr3 = Array.from(arrayLike);
    4、扩展运算符(…)
    ES6中新增的方法,扩展运算符(…)也可以将某些数据结构转为数组
    let arr4 = [...arrayLike]

    实现jquery中addClass()和removeClass()的功能:

    function addClass(obj, className) {
    if (obj.className == '') {
    obj.className = className;
    } else {
    var arrClassName = obj.className.split(' ');
    if (arrIndexOf(arrClassName, className) == -1) {
    obj.className += ' ' + className;
    }
    }
    }
    function removeClass(obj, className) {
    if (obj.className != '') {
    var arrClassName = obj.className.split(' ');
    if (arrIndexOf(arrClassName, className) != -1) {
    arrClassName.splice(arrIndexOf(arrClassName, className), 1);
    obj.className = arrClassName.join(' ');
    }
    }
    }
    //判断要添加的类是否已存在
    function arrIndexOf(arr, v) {
    for (var i = 0; i < arr.length; i++) {
    if (arr[i] == v) {
    return i;
    }
    }
    return -1;
    }

    实现了事件绑定函数:

    function bind(obj, evname, fn) {
    if (obj.addEventListener) {
    obj.addEventListener(evname, fn, false);
    } else {
    obj.attachEvent('on' + evname, function () {
    fn.call(obj);//调用call方法,在IE下将this从指向window改为指向当前对象
    }
    )
    }
    }
     

    原生JavaScript实现返回顶部的通用方法

    function backTop(btnId) {

        var btn = document.getElementById(btnId);

        var d = document.documentElement;

        var b = document.body;

        window.onscroll = set;

        btn.style.display = "none";

        btn.onclick = function() {

            btn.style.display = "none";

            window.onscroll = null;

            this.timer = setInterval(function() {

                d.scrollTop -= Math.ceil((d.scrollTop + b.scrollTop) * 0.1);

                b.scrollTop -= Math.ceil((d.scrollTop + b.scrollTop) * 0.1);

                if ((d.scrollTop + b.scrollTop) == 0) clearInterval(btn.timer, window.onscroll = set);

            },

            10);

        };

        function set() {

            btn.style.display = (d.scrollTop + b.scrollTop > 100) ? 'block': "none"

        }

    };

    backTop('goTop');



    原生JavaScript实现全选通用方法

    function checkall(form, prefix, checkall) {

        var checkall = checkall ? checkall : 'chkall';

        for(var i = 0; i < form.elements.length; i++) {

            var e = form.elements[i];

            if(e.type=="checkbox"){

                e.checked = form.elements[checkall].checked;

            }

        }

    }

    原生JavaScript实现全部取消选择通用方法

    function uncheckAll(form) {

        for (var i=0;i<form.elements.length;i++){

            var e = form.elements[i];

            if (e.name != 'chkall')

            e.checked=!e.checked;

        }

    }

    原生JavaScript判断是否为邮箱

    function isEmail(str){

        var re=/^w+((-w+)|(.w+))*@[A-Za-z0-9]+((.|-)[A-Za-z0-9]+)*.[A-Za-z0-9]+$/; 

        if (re.test(str) != true) {

            return false;

        }else{

            return true;

        }  

    }

    元素选择

      第一个返回选中id,其余则是返回一个数组
      document.getElementById()
      document.getElementsByName()
      document.getElementsByClassName()
      document.getElementsByTagName()


    window对象
     
      window.open() //打开新窗口
      window.location //在域名后追加地址进入新页面
      window.location.href //页面地址
      window.location.reload() //页面重载
      window.print() //打印页面
      window.scrollTo(100,500) //窗口滚动到指定位置、
     
    location对象
     window.location="/index.html" //基于原有域名下的页面跳转
      window.location.reload(); //重载页面
     
    获取input的value
      function check(browser){
        document.getElementById("answer").value=browser
      }
     
    ①reset()可以清空表单数据
    ②submit()可以提交表单
      function formReset(){
        document.getElementById("myForm").reset()
      }
      document.getElementById("myForm").submit()
      document.getElementById('text1').focus() //获取焦点
      document.getElementById('text1').blur() //失去焦点




  • 相关阅读:
    修改oracle的sys、system密码
    错误随手笔记
    JS 全选
    ider向虚拟机上传jar包
    Spring中的八大设计模式
    事务的隔离级别
    hive常用函数全集
    Kafka常用命令
    字符设备驱动框架学习总结
    根文件系统熟悉(一)根文件系统构建过程记录
  • 原文地址:https://www.cnblogs.com/xiaobai-y/p/10171720.html
Copyright © 2011-2022 走看看