jQuery学习

------------恢复内容开始------------

jQuery通过美元符号$选择HTML元素进行操作

#是选择id标签元素    .是选择class标签的元素  如下所示

$("#test").hide() $(".test").hide() jQuery是JavaScript库，封装了一些JavaScript操作的方法，只需要调用jQuery中的方法就可以对HTML元素执行某些操作

模式：$(selector).action()  美元符号定义 jQuery  选择符(selector)查找HTML元素 action执行对HTML元素的操作

jQuery选择器的几种方式

1.HTML元素选择器 

#id 选取特定的id名的元素标签进行操作   .class选取特定的类名的标签元素进行操作  $("P")选取全部的P元素标签进行操作

2.属性选择器

通过使用Xpath表达式来选择含有指定属性的元素进行操作   $("[href]") 选取所有带有href的属性的元素进行操作

3.css选择器

jQuery  css选择器选择元素的class样式进行操作。  $("p").class("")对p元素进行样式上的修改

 

jQuery事件

最好的选择就是把jQuery函数放在单独的js文件中，然后在head中引用就行，这样做易于维护

jQuery几种常用的事件函数 

$(document).ready(function) 将函数绑定到文档的就绪事件（当文档完成加载时）这个是总函数 所有事件都要放在这个里面

$(selector).click(function)  触发或将函数绑定到被选元素的点击事件

$(selector).dblclick(function)  触发或将函数绑定到被选元素的双击事件

$(selector).focus(function)  触发或将函数绑定到被选元素的获得焦点事件

$(selector).mouseover(function)   触发或将函数绑定到被选元素的鼠标悬停事件

 

jQuery效果

通过使用toggle（）方法来切换使用hide和show方法。。。。。。。

 

jQuery DOM操作（增删改查）

dom document object model  文档对象模型

alert用于在控制台输出文本，类似于弹窗   .text() 获取标签内的文本  .html()获取所选元素的内容 val() 方法获得输入字段的值  attr() 方法用于获取属性值  

对css类进行增删改查操作 采用css()方法

div区域 包含了内边距(padding)  边框(border)  外边距(margin）  document方法和Windows方法获取HTML文档和网页的宽度和高度。width和height是div实际内容的宽度和高度。

 

 

 

 

jQuery遍历

向上移动查找祖先 向下移动查找子孙 水平移动查找同胞

祖先parent parents parentsuntil   后代   children find  同胞 siliblings  next nextall nextuntil

过滤

&(selector).load(url,data,callback);

 

jQuery入口函数  $(document).ready(function(){执行代码} ）也可以简写为&(function（）{执行代码}）

JavaScript入口函数 windows.onload = function(){执行代码}

 

jQuery 入口函数与 JavaScript 入口函数的区别：

  jQuery 的入口函数是在 html 所有标签(DOM)都加载之后，就会去执行。

JavaScript 的 window.onload 事件是等到所有内容，包括外部图片之类的文件加载完后，才会执行。 

 

 

   

 

 

 

 

 

 

 

 

------------恢复内容结束------------