35_尚硅谷_大数据JavaWEB_JQuery 框架的简单使用.avi原创

来我们接着说啊，呃，那么刚才呢，我们通过我们这原始的一个对象，就是我们的XHR这个对象呢，发送了异步请求，那么其实呢，呃，我们有一个框架啊，需要给大家去说一下，叫做JA query呃，这个框架呢，它就是我们javascript一个什么比较主流的一个框架啊，叫做什么JA query呃，它是这个当下比较流的这个javascript一个库啊，然后呢，它封装了很多预定义的对象可实现，也就意味着我们其实是可以使用JA query来去做我们所有JS相关的操作的，而且呢，做起来要比原生的JS简单很多，而且呢用起来也比较方便，所以说呢，接下来我们就来给大家去介绍一下这个jaquiry的一个用法啊，那么首先这个J块RY是个什么东西呢？它其实说白了就是一堆写好的JS代码。啊，然后呢，他把这个东西呢，保存到了一个点JS文件中，那么我们只需要提前把这个JS文件给他引入进来，我们就可以使用他已经写好的这个JS代码了。

啊呃，当然我们用这个这块的主要目的呢，就是他对我们的S呢，也提供了一个支持，大家应该也能感受出来，就是我们刚刚写的这个代码其实比较复杂。那么我们使用了这块以后呢，要比这个简单很多，理解吧，要比这个简单很多啊，所以说呢，诶，它对于我们的JA也做了支持，怎么支持的呢？大概就是提供了这么几个方法，有什么dollar.get什么dollar.post什么dollar.adjust等等一些。明白这个意思吧，啊，那么呃，这个j query到底是一个什么东西呢？其实大家注意JA query它的这个对象呢，说白了就是我们倒对象的一个数组或者是集合。比方说这是我的盗墓对象啊，什么样的盗墓对象呢？就是我们通过这个document去获取到的那个元素对象叫做盗墓对象，然后呢，这块的对象呢，就相当于把你的倒对象给你封装成一个数组啊，或者说你叫成集合也行啊，因为这个数组跟集合没啥区别，理解吧，OK，那么这个大家要知道，那么既然我们是这样的一种关系，那我就可以进行一个相互的转换，看明白了吧，所以说呢，我们首先呢，把这个解块的一个简单用法呢，先给大家说一下，然后我们再去说对这个jas的一个支持啊来，接下来回到我们的代码中，呃，那么首先呢，我们还是呃做这样的事哈，嗯，我看看我写到哪个里面啊，写到这个index页面中吧，好吧。

写到这个里面啊，这里面我们都当成一个测试的啊，然后呢，呃，如果你要去使用我们这个指query，那么首先呢，你要去导入我们的这个指块库啊，那么这个指块肉库在哪呢？大家注意。在我发下去这个资料里面就有一个j query，看到没有，就是这个东西叫做j query，一点G点命点JS，它就是一个什么JS文件，那么我们提前呢，把这个CTRLC拿到我们的工程中，怎么拿进来呢？在web content下面，我给它创建一个lo，比如说我就叫s squares，然后呢，把我的那个JS库呢，就给它放到这里面了，看到了吧？啊，你可以打开看一眼哈。

但是呢，哎，你得鼓起勇气是不是？啊，你知道这是啥吗？啊。能看到这是啥吗？啊啊，我能看到这是个哇，是吧，看到了吗？我告诉你这就是一个写好的。JS代码，但是呢，这个东西特别强大，相当强大，明白吧，这是谁写的呀？啊，牛人写的是吧？啊，我们就只有使用的这个份了啊，OK，来吧，这个不需要我们关心了哈，你就知道把它导入进来，导入进来以后呢，在我的页面中，如果你想用它，你也需要把它引入进来，怎么引入呢？那我们就通过一个这个script的标签，你看了哈，它不仅可以定义我们的JS代码，还可以去引入，你看哈，来scripts好引入，怎么引入呢？就是通过src在这里面去写，引入谁呢？引入我这个scripts下面的就是SCRPTS这个下面的一个文件就是它来，你就CTRLC一下，CTRLV往这一放，这就行了。

明白了吗？诶，这就把它引入进来了，那么引入进来以后呢，我们就可以啊，在这个scripts里面就是可以什么去使用它了，当然这里面你就不要再去写代码了，明白吧，一般的话我们就把它当成一个引入的一个过程了啊呃，那一般情况下的话，我还习惯性的把这个代码呢，写到什么呀，写到我们这个script的上面啊，就相当于先把它引入进来，然后呢，再在我们这个script里面去写我们具体的一个代码。

明白吧，啊呃，首先呢，对于这块来讲，教大家一个语法，就是我们的Dollar大括号，然后呢，Function大括号小括号，先教这个语法。这个语法是什么意思呢？注意，它就相当于我们的window.onload大家还记不记得这个onload呀，是不是加载完毕的事件啊，那我告诉你，这个东西放到这儿，只要我整个的文档加载完毕了，它就会执行，所以说你看我直接写到这里面的一个代码，比方说哎，文档加载完毕了。看到了吧，这个代码只要我当前的影单词页面加载完毕，它就会执行了，我们来试一下啊好，首先呢，我们来把这个重新启动一下。启动完以后呢，我们来访问一下，访问到我们的a.gsd，你看一下出来了吧，文档只要加载完毕它就出来了，你再刷新一下也是一样的道理。

能明白了吧，哎，这个语法大家需要记住了啊，叫做什么呀，Dollar我再写一次哈，就是什么呀，Dollar小括号，然后呢，Function小括号大括号就在这里面。会写了吧？OK啊，来把这个删掉啊，那我们这个整块瑞可又做什么事呢？你看了哈，呃，我下面的不是有这个，呃，什么SPA1什么音input吗？是有这些东西吧，比如说我现在想使用j query呢，给它去更换一下这个东西了，那怎么做呀？啊，我告诉你哈，你就对比着我们写过了这个代码，这个代码是不是还是比较复杂的呀，但是使用了这块以后呢，你看好了哈，来这里面首先呢，它是不是有一个事件了，你看了哈，我要去点谁呀，我要去点这个东西吧，哎，点它我要进行更换，那么使用了这块以后呢，我们就不希望这个事件呢写到这儿了，而是给它做一个动态绑定，比如说我再来写一个input吧，你看在这个下面啊，再写一个input tap呢，等于还叫八成，然后呢，Y6呢，等于什么呀？呃，测试我们的JA块吧，能看到吧，我没有给他绑定任何事件，但是呢，如果说我想让他有一个监听事件咋办呢？来注意你给他一个ID，好ID，比如说什么叫第二吧，能看到吧，那么我们代码可以怎么写呢？注意，在这个位置我们就可以写成。

Dollar，注意井号第二，这是我们JA块里面的一个ID选择器，它的语法，这个就相当于什么呀，这一段代码就相当于来注释一下，给你解释一下哈，就这么简单一写，它就相当于什么呀，相当于。

哎，相当于document get element by ID，然后呢，把什么呀，把第二写到这。你说你愿意写这个还是愿意写这个呀？啊。效果是一样的，你写它也是获取到一个对象了，你写它也是获取到你什么呀，也是获取到这个对象了，肯定是这块的写法简单了吧，对吧，那我就可以怎么写的呢？你看看注意了哈，就是我给它绑定事件Dollar井号，第二点滴事件我们叫做什么呀？On click是不是，但是这个地方不能写on click，直接写click就行了，把那个on去掉，听明白了吧，把那个on去掉啊，然后呢，后面呢写个小括号，小括号里面呢写个function，再写个它这个代表的意思就是什么呀，当你的这个对象发生了点击事件以后，它就会执行这个匿名函数了。

听明白了吗？哎，很简单的哈，那么在这里面我就可以做什么事了呢？是不是啊，把它的数据给他改一改啊，比如说我先获取一下这个数据吧，怎么获取啊，那就是什么，是不是S1啊，你看我就可以怎么写的呢？那就是Dollar井号S一点什么呀，中间的内容叫什么呀，以前是in的HTML吧，但是现在呢，就叫做HTML，但是注意它是一个方法理解吧，所以说后面要写个小括号，然后呢，Where，我们的这个message就等于它，然后呢，我也给你了解一下message，我们来先看看这个好使不好使啊，来访问一下。

测试这块的，你看看我点一下获取到了没有，获取到了吧，然后呢，还可以做什么事啊，我获取到了你以后呢，我还可以把这个值啊，我也给你设置到谁里面啊，设置到这个input里面对不对，那叫做IE啊，那我们就可以怎么做了，你看了哈，那就是Dollar井号I1怎么写啊，以前是什么Y6等于什么yage吧，是不是，是不是给这个对象的Y6负值啊，大家注意，现在你不能使用value了，为什么呢？因为这个对象是一个jaquiry对象，而我们以前使用value的话，它是一个什么呀？Do对象能明白吗？OK，所以说这个地方我们应该怎么写呢？应该怎么写啊？啊。应该怎么写啊，这么写注意了哈，第2VAL，然后呢，把你的message放进去，用到了一个方法叫做Val方法，好我就把这常用的给大家一介绍就行了哈，主要我们用这块二呢，是去操作这个adjust的啊，这个只是大家对这个语法呢有一个简单的认识哈，好来试一下吧，刷新一下，你看我点一下进来了没。

看好了哈，来点一下，哎，注意哈，等一下啊，刷新一下好点一下进来了吧，看到了吗？OK，所以说这个就用起来特别简单了。啊啊，那么呃，这是我们这个这的一个什么简单的语法哈，然后呢，呃，我们接下来再给大家去说一下这个这块对象的跟这个do对象的一个呃简单转换哈，那我就写到这吧，啊就是我们这个呃，JA块对象转我们的。Do对象怎么转啊，你看现在我获取到的这个啊，到S1是不是就是一个整块的对象啊，对吧，那就是你看啊哇，然后呢，J obb勾就等于什么呀，井号，哎不是井号大括号啊，就是这个Dollar括号，然后呢，井号SE是不是获取到了什么这块对象了吧，那么如果说哎你想把它转成这个do对象怎么转呢？那就特别简单，就是dob高就等于什么呀。

就是JB勾点啊，你可以这么写，直接写个零，把它当成一个数组来处理，获取数组里面的第一个就给它转回来了，或者说呢，你还可以怎么写啊，就是JB勾点GET0，你看这是不是集合的一个操作呀。对吧，这两种方式都可以啊，都能把一个J块RY转成一个do啊，那么再转回来这个dob go呢，你就可以使用什么了呢，你就可以使用那个什么inner HTML啊，或者是使用那个什么value属性了，因为它就是一个do对象。啊，再一个的话，就说一下do对象能不能转这个这块位啊，哎，也可以怎么转呢，那现在我这个dob勾就是我的结构，呃，这个道对象吧，怎么转呢，就是Y，比如说这个JJOB勾吧。

可以吧，哎，就接近OB勾了哈，就等于什么呀，你直接把这个dob勾放到一个Dollar括号里面，这就把一个do给你转成一个什么这块的对象了。所以这个语法的话，大家需要知道一下啊，就是呃，我们可能会用到这个转换，但是呢，一般情况下我们都是直接获取这块对象，通过这块对象去操作的，我们很少会把它转回来的，好讲这个的目的呢，就是让你理解JA query对象，其实就是原生的这个do对象的一个数组，或者说呢，也可以造成一个集合，你把这个知道了就OK了，明白了吧，另外一个的话，就知道一下这个这块怎么去用哈，就是先要把这个导入进来，然后呢，再到它里面呢，使用一个Dollar function这个语法啊，那么接下来在这里面的话呢，还给大家去教教了一个动态绑定事件啊，这个叫做什么呀？动态绑定事件明白了吧，就是我们没有把这个事件呢，直接给你绑定到这个标签上面，因为什么呀，因为这个是一个普通的HTML标签，能明白吧，像这个是一个普。

中的HTML标签，而我们那个事件呢，它其实是属于我们JS的东西，理解吧，如果说你把JS也写到这了，相当于JS跟这个HTML就相当于耦合到一起了，但如果现在我们这么写的话，你看这里面你是看不到任何JS的东西的，而我的JS就完全都迁移到了这个地方了，就相当于给他们也分离开了。明白这个意思了吧，OK。