zoukankan      html  css  js  c++  java
  • javascript学习笔记1

    对象

    用户自定义对象:程序员自行创建的对象;

    内建对象:内建在JS语言中的对象,如Array、Date和Math等;

    宿主对象:由浏览提供的对象。

    window对象对应浏览器窗口本身,这个对象的属性和方法通常称为BOM(浏览器对象模型)。

    节点

    DOM(文档对象模型)比作一棵树,html是树根,代表整个文档。

    元素节点:标签,如<body>、<p>、<ul>等。

    文本节点:标签中的内容,包含在元素节点的内部。

    属性节点:对元素做出更具体的描述,被包含在元素节点中。<a>标签中的title。

    文档中的每个元素都是一个对象。

    获取元素

    getElementById:document.getElementById(‘idName’);

           alert(typeof document.getElementById('test'));    //object

    getElementsByTagName

           alert(typeof document.getElementsByTagName('p'));

    alert(document.getElementsByTagName('*').length);

    getElementsByClassName:可以查找带多个类名的元素,类名不区分顺序。由于这个方法较新,某些DOM里可能不兼容。

    <p class="test">aaaaaaaaaaa</p>

    <p class="test">aaaaaaaaaaa</p>

    <p class="test2">aaaaaaaaaaa</p>

    <p class="test2 aa">aaaaaaaaaaa</p>

    <p class="test2 aa">aaaaaaaaaaa</p>

    <p class="test2 aa bb">aaaaaaaaaaa</p>

    <script>

    alert(document.getElementsByClassName('test2').length);   //4

    alert(document.getElementsByClassName('test2 aa').length);      //3

    alert(document.getElementsByClassName('aa').length);       //3

    </script>

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

    获取和设置属性

    getAttribute

           object.getAttribute(attribute);

    setAttribute

           object.setAttribute(attribute,value);

    document.getElementById('test').setAttribute('class','classname')

    alert(document.getElementById('test').getAttribute('class'));

    <input type="test" onclick="alert(this.value);" value="test">

    <a href="http://jd.com" onclick="alert(this.href);return false;">test</a>

    事件

    onmounseover:鼠标指针悬停在某元素时触发。

    onmounseout:鼠标指针离开某元素时触发。

    onload:页面加载里执行。

    childNodes:获取元素的所有子元素。返回的数组包含所有类型的节点,文档中几乎每一样东西都是一个节点,甚至连空格和换行符都会被解释成节点。

    var len = document.getElementsByTagName('body')[0].childNodes.length;

    nodeType:节点类型,共有12种。

           node.nodeType

           元素节点的nodeType值是1,属性节点的值为2,文本节点的值为3。

    nodeValue:节点的值。

           node.nodeValue

    firstChild==childNodes[0]

    lastChild==childNodes[node.childNodes.length]

  • 相关阅读:
    第36课 经典问题解析三
    第35课 函数对象分析
    67. Add Binary
    66. Plus One
    58. Length of Last Word
    53. Maximum Subarray
    38. Count and Say
    35. Search Insert Position
    28. Implement strStr()
    27. Remove Element
  • 原文地址:https://www.cnblogs.com/lltong/p/3123044.html
Copyright © 2011-2022 走看看