zoukankan      html  css  js  c++  java
  • JS中的事件、数组、节点对象处理

    在JS代码中编写事件一定要保证页面在浏览器中加载时会把事件加载进页面

    事件:在代码中可以通过一个动作来触发另一个行为的总称
      A:事件的编写方式1
        HTML标签中添加 onxxxx = "函数";
      B:JS代码中获取事件源对象,更好的解耦合
        对象.onxxxx = function(){}
          本质就是为某个对象赋值函数
          事件类型:
            1.获得焦点事件 ---- onfocus
            2.失去焦点事件 ---- onblur
            3.鼠标移入 onmouseover
            4.鼠标移除 onmouseout
            5.下拉列表改变事件 onchange

    关键字:this
      this是当前对象,就是和当前方法绑定谁谁就是this对象
      HTML代码中哪个标签中有绑定事件,哪个就是当前对象
      JS代码中 对象.onxxxx = function(){
            函数中的this就是这个对象}

    DOM:
    所有的标签型文档都可以看成一个DOM对象,有一颗DOM树,里面的所有元素,属性,文本都可以看成一个节点

    获取标签对象的方式:
      1.document.getElementById("id值");
      2.document.getElementsByTagName("标签名");
      3.document.getElementsByClassName("类名");
      4.document.getElementsByName("name值");
      在HTML文档中,只承认了ID是一个唯一属性,所以其它的都是返回数组

    数组:
      创建数组
        var arr1 = new Array();//创建一个空数组
        var arr2 = new Array(3);//创建一个指定长度的数组
        var arr3 = new Array("a","b","c");
        var arr4 = [1,2,3];
      使用:
        arr.length //长度
        arr[索引] = "新值"; //使用和赋新值
          1.不存在越界:undifind
          2.长度可变
          3.数组的元素数据类型可以不一致
      创建使用二维数组:大盒子嵌套小盒子
        var out = new Array();
        out[0] = new Array("a","b");
        out[1] = new Array(1,2,3);
        out[2] = "3";

    event对象:event.clientX event.clientY 得到对象的坐标
    在JS的代码中可以直接给文本值赋值标签,可以直接解析
      对象.innerHTML = "<font id="id1" color="red">这是JS设置的文本和CSS组合</font>"
      创建标签对象节点:createElement("标签名");
      创建文本节点:createTextNode("文本内容");
      appendChild:为标签添加子节点(移动节点)
      对象.children 返回一个数组,存储的是此节点下面的子节点元素


  • 相关阅读:
    Longest Mountain in Array 数组中的最长山脉
    css 解决 图片 底部 3像素问题
    获取当前年月日2020-09-30格式
    vue + elememt ui table 实现滚屏效果
    滚动字
    layui 之监听 select 的变化
    正则匹配非汉字
    layui form里的select元素动态赋值无效
    layui 之 弹框重新打开 upload无效
    GPS坐标转百度坐标
  • 原文地址:https://www.cnblogs.com/chonglchong/p/6810747.html
Copyright © 2011-2022 走看看