• javascript的一些常用知识点


    1. 查看你的html文档中一共有多少个节点 :   document.getElementsByTagName(" * ").length;

    2.  document.getElementsByClassName() 这个用来获取classname,但是对于老版本的浏览器还不是很支持,要支持老版本的浏览器的写法:

    function getElementsByClassName(node,classname){
              if(node.getElementsByClassName){
                  return node.getElementsByClassName(classname);
              }else{
                  var results=[];
                  var elems=node.getElementsByTagName("*");
                  for(var i=0;i<elems.length;i++){
                      if(elems[i].calssName.indexOf(classname) != -1){
                          results.[results.length] = elems[i];
                      }
                  }
                  return results;
              }
          }

    3.  onload事件的用法(在页面的图片,css文件等资源全部都加载完成后触发);

    如果window.onload需要绑定的函数很多的情况下的使用方法:(弹性最佳解决方法,它是由Simon Willison编写的;)

      function addLoadEvent(func){
        var oldonload=window.onload;
        if(typeof window.onload != "function"){  //当window.onload上没有绑定函数时,把函数添加给它;
          window.onload=func;
        }else{
          window.onload = function(){           //当window.onload上绑定了函数,把新函数追加到现有指令的末尾;
            oldonload();
            func();
          }
        }
      }
    添加绑定的函数:  addLoadEvent(firstFunc);
                     addLoadEvent(secondFunc);

    4.在已有的元素后面插入一个元素:

    insertBefore()在已有的元素前插入一个新元素:parentElement.insertBefore(newElement,targetElement);
    没有insertAfter()在已有的元素后插入一个新元素的方法:自己编写:
      function insertAffer(newElement,targetElement){
        var parent=targetElement.parentNode;
        if(parent.lastChild == targetElement){
          parent.appendChild(newElement);
        }else{
          parent.insertBefore(newElement,targetElement.nestSibling);
        }
      }

     5.   accesskey属性可以把一个元素与键盘上的某个特定的按键关联在一起:
           eg:<a href="index.html" accesskey="1">Home</a>

    6.  CSS-DOM:(如何用DOM技术去获取和设置CSS信息:)
       获得style属性的方法:           element.getAttribute("style"):返回的值是包含CSS的文本;
     (style属性只能返回内嵌样式)    element.style.property:通过属性访问返回的是一个对象;(style是以编程方式访问元素样式的,并没有直接映射到style对象上);

    7.   className属性: 给一个元素追加class名字的函数:value表示新class名字;

        function addClassName(element,value){
          if(!element.className){
            element.className=value
          }else {
            newclassName=element.className;
            newclassName+=" ";
            newclassName+=value;
            element.className=newclassName;
          }
        }

    8.     创建文档碎片:var frgment=document.creatDocumentFragment();

    9.     "javascript:" 伪协议:一种非标准化的协议;它让我们通过一个链接来调用JavaScript函数 ;
               例如:<a href="javascript:函数名(参数);">00000000000000</a>
               注意:在HTML文档通过"javascript:" 伪协议调用javascript代码的做法非常不好;
                       <a href="#" onclick="函数名(参数)return">------</a>:# 某些浏览器里表示指向当前文档的开头;可以创建一个空链接;与上面的做法同样不好,它们都不能平稳退化,
                                                         如果用户已经禁用了浏览器的javascript功能,这样的链接毫无用处;
                       <a href="www.baidu.com" onclick="函数名(this.href);return false"></a>  (这种写法效果好些,在JS禁用后还是可以打开页面);

  • 相关阅读:
    电商交易背景知识合集第二季
    技术高手如何炼成
    #研发解决方案#基于Apriori算法的Nginx+Lua+ELK异常流量拦截方案
    电商交易背景知识合集第一季
    真刀真枪压测:基于TCPCopy的仿真压测方案
    安全基础教育第二季第1集:屡战屡败的找回密码
    #研发解决方案#从宏观到微观——天机与鹰眼联手
    挖坑和踩雷
    我们过去几年做对了哪些事
    小伙伴们手滑集
  • 原文地址:https://www.cnblogs.com/liaolei1/p/7149672.html
Copyright © 2020-2023  润新知