个人笔记| jQuery按需学习

可以通过 jQuery选取（查询，query） HTML 元素，并对它们执行“操作”（actions）

目前在vue里好像没见过文档就绪函数……？这合理吗……？大概是因为都在mounted或者methods里用？

jQuery语法

主要目的就是选取HTML元素然后执行操作

标志是$ 在vue里看到加粗的紫色$的话八九不离十就是jQuery了

基础语法

$("selector").action()

• $符号定义jQuery
• selector是选择器 对标HTML元素
• action就是对选好的HTML元素做点什么

jQuery选择器

大概就是说 只要你会玩 只要你玩得好 HTML就随便你玩 想玩啥玩啥 想玩多少玩多少

元素选择器

类同CSS选择器 用来选HTML元素的

• $("p")选取<p>元素

• $(".class")选取class=class的元素

• $("#id")选取id=id的元素

  你搁这搁这呢.jpg）

  扒一下W3CSchool的示例

  语法	描述
  $(this)	当前 HTML 元素
  $("p")	所有 <p> 元素
  $("p.intro")	所有 class="intro" 的 <p> 元素
  $(".intro")	所有 class="intro" 的元素
  $("#intro")	id="intro" 的元素
  $("ul li:first")	每个 <ul> 的第一个 <li> 元素
  ='.jpg']")	所有带有以 ".jpg" 结尾的属性值的 href 属性
  $("div#intro .head")	id="intro" 的 <div> 元素中的所有 class="head" 的元素

属性选择器

用来改HTML的CSS属性的

jQuery事件

推荐把jQuery函数放到独立的.js文件里 这样好用也好改

jQuery事件函数

事件处理程序指的是当 HTML 中发生某些事件时所调用的方法。术语由事件“触发”（或“激发”）经常会被使用

就是我跟HTML元素说 我这么整的时候你给我这么动！ 但是我光这么说它届不到 我要用jQuery翻译一下它才懂

今天也在为和程序顺畅交流操碎了心

 $("button").click(function(){
    $("p").hide();
  });

jQuery名称冲突

jQuery和其它JS库里的函数可能会在$的使用上产生冲突

那咋整呢 那就要靠jQuery的noConflict()方法了

var 你想要的名字 = jQuery.noConflict()

jQuery效果

用jQuery可以实现什么效果

隐藏/显示、淡入淡出、滑动、动画等等等

很多嗷 不过最近用的就是隐藏/显示

jQuery隐藏/显示

语法：

$(selector).hide(speed,callback);

$(selector).show(speed,callback);

参数	描述	值
speed	（可选）规定隐藏/显示	"slow"、"fast"或者ms
callback	（可选）隐藏/显示完成后执行的函数名称

$("button").click(function(){
  $("p").hide(1000);
});