JQuery学习总结【一】

网络编程 2025/1/19 佚名

3 2 1

JQuery学习总结【一】

一：JQuery

1 JQuery知识

*：就是让我们学会调用JQ插件，其实内部就是对JS的封装。

*：jquery里面有三个文件，

第2个和第3个其实里面的内容是一样的，只是第三个对其进行了压缩，使浏览器对其的访问时间变短。

我们在使用的时候将Jquery-1.4.2.js和jquery.1.4.2-vsdoc,js放在一起，其实vsdoc.js是对于前面的解释说明，它是让我们在编写代码的时候可以点操作出来。

*:练习《点击按钮弹出对话框的内容》《点击网页里面的文字使文字一行一行消失》(“$”这个其实是个函数)

<head> 
<script type="text/javascript" src="/UploadFiles/2021-04-02/jquery-1.4.2.js">

2 JQuery里面的Ready 《在网页刚开始就弹出内容》
$(dounction).ready(function(){alert(“加载完毕”);})
其实还可以这样子写
$(function(){alert(“加载完毕”);});
<解析：”$”这个函数将匿名函数function()注册为Ready执行。>
3 jquery内置函数
  .map(array,fn)对数组中array中的每一个元素调用fn函数进行处理，fn函数将处理返回，最后得到一个新的数组。.map(array,fn)对数组中array中的每一个元素调用fn函数进行处理，fn函数将处理返回，最后得到一个新的数组。map不能处理Dictionary风格的数组。要用下面的$.each来处理。
  $.each(array.fn)对数组arr每个元素调用fn函数进行处理，没有返回值。


var arr=[3,5,7]; 
Var arr2=$map.(arr,function(item){return item*2}) 函数式编程。 
Var arr={“tom”;”檀木”,”xiaozhang”;”小张”} 
$.each(arr,function(key,value){alert(key+”=”+value);});



4 JQuery对象，Dom对象
<dom就是浏览器的一些标记，比如层，按钮，标签等，数组是jq的对象。>
Jquery对象就是通过jquery包装Dom对象后产生。而且jquery对象只能调用jquery对象封装的方法。不能调用Dom对象的方法。
$(function(){$(“#id”).css(“background”,”red”)});
上面的代码是复制，就是将背景色设置为红色，若.css中的属性为一个则为得到值，2个即为设置值。
5 jquery选择器
*id选择器
$(“#div”).html();
*TabName选择器<标签选择器>
$(“div”).click(function（）｛alert(“你好我是p”);｝);
这里就是将网页中所有的div标签都选择了，都向其添加了click事件。
* css选择器
  同时选择多个样式，就是给制定样式的添加。
$(“div”).click(function(){alert(“这是信息”)});
6 多条件选择器/层次选择器

7 jquery的迭代
  就是里面的错误程序不会给提示出错，我们自己要添加if/elae语句进行判断。

8 jquery的节点遍历
就是运用next（）,nextall()方法来进行遍历的。就好像在数组那里的遍历是一样的。  这里只是得到它的下一个元素的值。
Siblings()：获取所有元素的同辈元素(兄弟节点)。
*:jquery的链式编程


$("div").click(function(){
$(this).css("background","red").siblings("div").css("background","white")
});


就是很容易的通过点操作符来操作。
//这里是链式操作,减少了使用if/else等操作。改变了编程风格。


<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
 <meta charset="utf-8" />
 <title></title>
 <script src="/UploadFiles/2021-04-02/jquery-1.4.2-vsdoc.js">

9 ：基本的过滤器

这里可以将其写在一起，比如选择器和过滤器，这样子就会很强大。
不仅可以使用选择器进行绝对定位，还可以进行相对定位，只要在$()指定第二个参数，第二个参数为相对的元素。
案例：

（相对定位）

   ：这里的元素就是在定位#tables tr 下的td的定位
10 属性过滤器

Eg：


<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
 <meta charset="utf-8" />
 <script src="/UploadFiles/2021-04-02/jquery-1.4.2.js">

11 元素的each <通过一些过滤器和选择器来遍历each一些元素。>


<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
 <meta charset="utf-8" />
 <script src="/UploadFiles/2021-04-02/jquery-1.4.2.js">


以上就是本文的全部内容，希望对大家有所帮助，下篇文章继续介绍JQuery基本知识--JQuery学习总结【二】，有兴趣的朋友可以看下。谢谢对的支持！

                                
                                
                                    jquery学习总结 
                                
                                    标签：
                                        jquery学习总结

免责声明：本站文章均来自网站采集或用户投稿，网站不提供任何软件下载或自行开发的软件！如有用户或公司发现本站内容信息存在侵权行为，请邮件告知！ 858582#qq.com

评论“JQuery学习总结【一】”

JQuery学习总结【一】

暂无“JQuery学习总结【一】”评论...

《魔兽世界》大逃杀！60人新游玩模式《强袭风暴》3月21日上线

暴雪近日发布了《魔兽世界》10.2.6 更新内容，新游玩模式《强袭风暴》即将于3月21 日在亚服上线，届时玩家将前往阿拉希高地展开一场 60 人大逃杀对战。

艾泽拉斯的冒险者已经征服了艾泽拉斯的大地及遥远的彼岸。他们在对抗世界上最致命的敌人时展现出过人的手腕，并且成功阻止终结宇宙等级的威胁。当他们在为即将于《魔兽世界》资料片《地心之战》中来袭的萨拉塔斯势力做战斗准备时，他们还需要在熟悉的阿拉希高地面对一个全新的敌人──那就是彼此。在《巨龙崛起》10.2.6 更新的《强袭风暴》中，玩家将会进入一个全新的海盗主题大逃杀式限时活动，其中包含极高的风险和史诗级的奖励。
《强袭风暴》不是普通的战场，作为一个独立于主游戏之外的活动，玩家可以用大逃杀的风格来体验《魔兽世界》，不分职业、不分装备（除了你在赛局中捡到的），光是技巧和战略的强弱之分就能决定出谁才是能坚持到最后的赢家。本次活动将会开放单人和双人模式，玩家在加入海盗主题的预赛大厅区域前，可以从强袭风暴角色画面新增好友。游玩游戏将可以累计名望轨迹，《巨龙崛起》和《魔兽世界：巫妖王之怒经典版》的玩家都可以获得奖励。

更新动态

2025年01月19日

JQuery学习总结【一】

jquery学习总结

基于vue.js实现图片轮播效果

Vue.js第一天学习笔记（数据的双向绑定、常用指令）

评论“JQuery学习总结【一】”

《魔兽世界》大逃杀！60人新游玩模式《强袭风暴》3月21日上线

更新动态

友情链接