欢迎来到原中小学教育资源网!

jquery课件资料

课件 时间:2018-04-20 我要投稿
【www.ruiwen.com - 课件】

  jQuery本身只有一个js文件,所以,要使用它,就和使用其它的js文件一样,直接将它引入就可以使用了,下面是小编为大家收集整理的相关内容,欢迎阅读。

  

  Jquery基础知识点

  JQuery上:

  1,各种选择器 $(#id) $(.class) $(tag标签) $(*) $(s1,s2,s3)

  2,层次选择器 $(s1,s2) $(s1>s2) $(s1+s2) $(s1~s2)

  3,并且选择器

  :first :last :eq(索引值) :li(索引值) :even :odd $(s1s2s3s4..)

  4,内容过滤选择器

  :contains(text) :empty :has(选择器) :parent

  5,表单域选中选择器

  复选框 单选框 :checked

  下拉框 :selected

  属性操作

  $().attr(name)

  $().attr(name,value)

  $().removeAttr(name)

  $().attr(json对象)

  $().attr(name,function)

  快捷操作

  1,class属性值

  $().addClass()

  $().removeClass()

  $().toggleClass()

  2,标签包含内容

  $().html(内容)

  $().text(内容)

  3,css样式操作

  $().css(name) 行内,内部,外部 样式都可以获取

  $().css(name,value)

  $().css(json对象)

  4,val()操作value对象

  $().val(内容)

  $(复选框/下拉列表/单选按钮).val([元素,元素,元素])设置选中情况

  $(下拉列表/单选按钮).val() 选中项目中的value值

  复选框选中

  $().attr(‘checked’,true/false)

  $().attr(‘checked’)

  JQuery下:

  $符号由来

  $符号是函数名字,还可以使用jQuery

  jquery对象和dom对象的关系、转化

  dom对象 是 jquery对象的数组组成部分

  转换:

  jquery对象--》dom对象: $()[下标]

  dom对象--》jquery对象: $(dom对象)

  jQuery框架对象分析

  两种对象:jquery对象(各种选择器创建出来的)、$函数对象

  jquery对象可以调用成员:css()/addClass()/html()/text()/attr()等等

  可以调用成员:

  实例化 jquery对象: $(‘div’)-----> new jQuery.fn.init()

  ① init构造函数内部成员(length、selector)

  ② jQuery.fn的成员

  ③ jQuery.fn.extend()复制继承的成员

  $函数对象 调用的成员都是extend()复制继承过来的

  each遍历方法

  $.each(数组/对象, funciton(下标/成员名称 变量,(元素/成员)值变量){});

  $(‘li’).each(function(每个dom对象的下标变量,每个dom对象变量){

  this代表每个li的dom对象

  });

  加载事件、与传统不同

  加载事件的三种形式:

  $(document).ready(function(){});

  $().ready(function(){});

  $(function(){});

  加载事件(jquery与传统的区别):

  ① 设置个数

  ② 执行时机

  jquery加载事件原理:

  对DOMContentLoaded事件的封装(非onload)。

  jquery简单事件设置

  $().事件类型(处理函数); //设置事件

  $().事件类型(); //触发事件执行

  文档操作

  节点追加:

  父子关系:append() prepend() appendTo() prependTo()

  兄弟关系:after() before() After() Before()

  替换:replaceWith()被动 replaceAll()主动

  删除:$(父节点).empty() $(匹配节点).remove()

  复制: $(节点).clone(true/false)

  属性选择器

  [name] [name=value] [name^=value] [name$=value]

  [name][name!=value] [name*=value] [][][][]

热门文章