jQuery

<!-- 
        常见的JavaScript库
        jQuery
        Prototype
        YUI
        Dojo
        Ext JS
        移动端的zepto
     -->
    <!-- 
         jQuery封装了JavaScript常用的功能代码 优化了DOM操作、事件处理、动画设计和ajax交互
      -->
    <div></div>
    <video src="video/movie.mp4" muted></video>
    <script>
        // 体验jQuery
        // $('div').hide();
        // jQuery入口函数
        $(function() {
            // 此处是页面DOM加载完成的入口
        });
        $(document).ready(function() {
            // 此处是页面DOM加载完成的入口
        })
    </script>
    <!-- 
        jQuery对象和DOM对象
     -->
    <script>
        // 1、DOM对象 用原生js获取过来的对象
        var myDiv = document.querySelector('div') //DOM对象
        console.dir(myDiv);
        // 2、jQuery对象 用jQuery方式获取过来的对象就是jQuery对象
        $('div'); //是应该jQuery对象
        console.dir($('div'));
        // 3、jQuery对象只能使用jQuery方法; DOM对象则使用原生的JavaScript属性和方法
        myDiv.style.display = 'none';

        $('div').hide();

        // jQuery对象转DOM对象 $(xxxx)[index]  $(xxxx).get(index) 都可以转换为DOM对象
        $('video')[0].play();
        $('video').get(0).play();
        // DOM对象转jQuery对象
        var myVideo = document.querySelector('video');
        $(myVideo); // DOM对象转jQuery对象
        // myVideo.play();

 

上一篇:如何使用JavaScript实现一个简单的动态表格,实现添加一行和删除一行表格(两种方法)


下一篇:web前端—前端三剑客之JS(14):BOM之location对象、history对象、事件冒泡和事件捕捉