js的基本语法3

获取元素的方式：

document.getElementById();

document.getElementsByClassName();

document.getElementsByName();

document.getElementsByTagName();

document.querySelector();对象

document.querySelectorAll();数组

因为js声明中不允许有- 所以可以使用驼峰命名法，

如：backgroundColor

li.style.backgroundColor="red"

 

 

DOM事件

dom事件允许js对html事件做出反应。当用户点击某个html元素时。为了在用户点击元素时执行代码，可以像js添加onclick=javascript.

事件：

        *click  单击

        *change 单选 多选  下拉框选项改变   文本框的值改变时

鼠标事件

      * mouseover

        *mouseout

 键盘的事件

        keydown

        *keypress

        keyup

鼠标事件 onmouseenter 和 onmouseover 的区别：

当为onmouseenter时不会冒泡，及不会重复触发父级事件，在进入父级时也不会触发子级事件。
当为onmouseover时会冒泡，只要进入到标签内就会触发标签内所有子集标签的事件，且在移动过程中父级标签会重复触发，出现连

续触发的问题，可以用原生js方法阻止事件冒泡。

选项卡

 js实现点击切换：

window.onload=function(){

            var as=document.querySelectorAll("li a");

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

                as[i].onclick=function(){

                    console.log(i);

                    for (var j = 0; j < as.length; j++) {

                     

                            as[j].className="";//清楚所有样式

                        } this.className="active";

                        //ajax

                    var url=this.attributes["data-url"].value;

                }

            }

        }

第一个选项卡里要添加：点击哪个选项卡哪个有active

class="active"