总结5.8 jquery操作

<script>

    //js寻找节点

    document.getElementById('id').parentNode;//父级节点

    document.getElementById('id').childNodes;//子集节点集

    document.getElementById('id').firstChild;//第一个子节点

    document.getElementById('id').lastChild;//最后一个子节点

    document.getElementById('id').nextSibling;//下一个同级节点

    document.getElementById('id').previousSibling;//上一个同级节点

    document.getElementById('id1').onclick = function () {

        alert('a');

        e.stoppropagation();//不再派发事件，使事件id1触发后分配到其他节点

        return false;//js中只阻止默认行为(如链接)，jq还会防止冒泡

        e.preventdefault();//取消默认行为

    }

    document.getElementById('id2').onclick = function () {

        alert('b');

    }//当id1为id2的子元素时，点击id1触发事件后会派发父级id2的事件

    

    $('ul li').hover(function () {

        $(this).css('color','red');//$(this)指当前元素   

    },function () {

        $(this).css('color','green');

    });//jq中有hover事件，第一个function指鼠标移上去触发的事件，第二个指鼠标移走触发的事件

    $('ul li').hasClass('a');//判断是否有'a'class名

    $('ul li').toggleClass();

    $('x').width();//获取宽度(只包含内容)

    $('x').innerWidth();//获取内容和内边距的宽度

    $('x').outerWidth();//获取内容、内边距和边框得宽度

    $('x').height();//获取高度(只包含内容)

    $('x').innerHeight();//获取内容和内边距的高度

    $('x').outerHeight();//获取内容、内边距和边框得高度

    $('y').append('a');//被选中元素中的末端插入'a'

    $('y').prepend('a');//被选中元素中的首端插入'a'

    $('y').after('a');//被选中元素之后插入'a'

    $('y').before('a');//被选中元素之前插入'a'

    $('y').remove();//删除被选中元素及其子元素

    $('y').empty();//删除被选中元素的子元素，保留被选中元素

    $(div).parent();//查找父级元素

    $(div).parents();//查找所有祖先元素

    $(div).children();//查找子集元素

    $(div).find();//查找所有后代元素

    $(div).siblings();//查找同级元素

    $(div).eq();//索引号元素

</script>