jQuery内容整合---（一）jQuery简介和与语法

一、jQuery简介
为了简化 JavaScript 的开发，诞生了一些 JavsScript 库。这些JavaScript 库封装了很多预定义的对象和实用函数。能帮助使用者建立有高难度交互的 Web2.0 特性的富客户端页面，并且兼容各大浏览器。当前流行的 JavaScript 库有: jQuery, MooTools, Prototype, Dojo, YUI, 其中应用最广泛的就是jQuery。

jQuery是继prototype之后又一个优秀的Javascript框架。其宗旨是——WRITE LESS,DO MORE,写更少的代码,做更多的事情。它是轻量级的js库(压缩后只有21k) ，这是其它的js库所不及的，它兼容CSS3，还兼容各种浏览器（IE 6.0+, FF 1.5+,Safari 2.0+, Opera9.0+）。
jQuery是一个快速的，简洁的javaScript库，使用户能更方便地处理HTML documents、events、实现动画效果，并且方便地为网站提供AJAX交互。
jQuery还有一个比较大的优势是，它的文档说明很全，而且各种应用也说得很详细，同时还有许多成熟的插件可供选择。
jQuery能够使用户的html页保持代码和html内容分离，也就是说，不用再在html里面插入一堆js来调用命令了，只需定义id即可。

二、jQuery语法

 1、js库的引入

<head>
//src=""内容表示js库的路径
<script src="../jq/jquery-3.4.1.js"></script>
</head>

2、jQuery的基本语法

<script>
        $(function(){
     
     
            
        });
</script>

或：

<script>
	$(document).ready(function(){
     
     

	});
</script>

第一种较为常用，为第二种的简写方式。
注：该内容可以放在代码的任意位置，头部、正文和尾部都可。

3、jQuery对象与dom对象的互换方法。

jQuery 对象就是通过jQuery包装DOM对象后产生的对象。
虽然jQuery对象是包装DOM对象后产生的，但是jQuery无法使用DOM对象的任何方法，同理DOM对象也不能使用jQuery里的方法。

我们约定：如果获取的是 jQuery 对象, 那么要在变量前面加上 $.
例：
var $variable = jQuery 对象
var variable = DOM 对象

DOM对象与jQuery对象是可以相互转换的

    <script>
        $(function(){
     
     
            // 通过dom的id选择器选择id为name的对象
            var name = document.getElementById('name');
            alert(name.value);//获取dom对象的值
            //通过$()方法将dom对象转换为jQuery对象
            var $name = $(name);
            alert($name.val());//获取jQuery对象的值
            //jQuery对象为一个数组对象，可直接通过[index]的方法转换为dom对象
            var name1 = $name[0];
            //jQuery本身提供.get(index)方法得到相应的DOM对象
            var names = $name.get(0);
            alert(names.value);
        });
    </script>

jQuery内容整合---（一）jQuery简介和与语法

猜你喜欢