zoukankan      html  css  js  c++  java
  • js----常用功能

    1、切割

    1. a="ddd"       a.substr(0,1)    
    

    2、通过js找子代

    document.getElementByClass("ddd").getElementByClass("ccc")
    

    3、window.open

    window.open( url,"n1","status=1, height:500, 600, toolbar=0, resizeable=0");    #在当前也打开一个窗口,页面不刷新
    window.open(url)                                                                      #重新在开启一个窗口,之前的页面不刷新
    

    window.opener使用

    子页面要向父页面传值,只要在document前面加window.opener即可

    window.opener.____  后面调用的父页面的方法

    例子

    父页面

    <body>
    <h1 id = "a">无所谓</h1>
    <a href="#" onclick=a("http://www.baidu.com")>点我点我</a>
    <script>
            function xxxpopupCallback(text) {
                document.getElementById('a').innerHTML = text;   //找到标签吧值替换成用户传进来的值
            }
            function a(url) {
                window.open( '/pop/', "n1","status=1, height:500, 600, toolbar=0, resizeable=0");
                {#window.open( url,"n1","status=1, height:500, 600, toolbar=0, resizeable=0");#}
            }
    </script>
    </body>
    

    子页面 

    <body>
    <input type="text" name="user">
    <button type="button" onclick="submit()">提交</button>
    </body>
    <script>
        function submit() {
        方法一
            window.opener.document.getElementById("a").innerText=document.getElementsByTagName("input")[0].value   #直接找到父页面的标签,进行替换值
        方法二:
            {#opener.xxxpopupCallback(document.getElementsByTagName("input")[0].value)#}     #opener.xxxpopupCallback  调用父页面的xxxpopCallback 方法
        window.close()
        }
    </script>
    

      

    4、删除列表中的某个值

    思路1:直接在delete上添加一个id属性(需要被删除的元素的id),通过js可以获取这个值,通过ajax发送异步请求,成功后,直接在页面上用js将他删除掉。

    思路2:使用a标签包含一个butten按钮

    思路2:使用form表单发送请求post请求,使用js方法(在js中创建表单,或者直接用页面上现有的表单进行submit())。

    5、定时器

    <script>
        //每隔1秒执行function()
        intervalId = setInterval(function () {
            console.log(4);
        }, 1000);
    
        //2秒之后执行function(),执行一次
        setTimeout(function () {
            //清除定时功能
            clearInterval(intervalId)
        },2000)
    </script>
    

      

    6、JS和Jquery获取input框中的值

    <input type='text' id = 'username>'
    var text = $(''#username").val("ddd")                      //jquery 获取值
    $('username').val("")                                      //jquery 设置值
    var name = document.getElementById("CSDN_NAME").value      //js获取值
    

      

    7、数组的filter

    var a = [1,2]
    a.filter(res=>{return false})  -->a = []
    a.filter(res=>{return true})  -->a = [1,2]
    

      

    const accessedRouters = asyncRouterMap.filter(route => {
        // console.log(route);
        if (hasPermission(route)) {
          if (route.children && route.children.length) {
            route.children = filterAsyncRouter(route.children);
          }
          return true;
        }
        return false;
      });
    

      

    前端js/vue等的一些技巧

    从后端取出来的数据,可以适当的对他进行编辑,比如添加一些字段show:true,方便自己操作

  • 相关阅读:
    HTML5 3D 粒子波浪动画特效
    CSS3手机端侧滑菜单 4种滑动菜单特效
    HTML5 Canvas生成粒子效果的人物头像
    HTML5实现手势屏幕解锁
    Slideout.js – 触摸滑出式 Web App 导航菜单
    简历特训笔记
    leetcode-184-Department Highest Salary 优化记录
    正则表达式学习笔记
    【原创】第一次实习面试
    【原创】第一次做网站的总结
  • 原文地址:https://www.cnblogs.com/yanxiaoge/p/10595646.html
Copyright © 2011-2022 走看看