2019-05-29《锋利的jQuery》

2.4 应用jQuery改写示例

var items = $('input[name='check']:checked') //items不加$,这样真的好吗

2.5 选择器中的一些注意事项

2.5.1 选择器中含有特殊符号的注意事项

1.选择器中含有特殊字符,用转义符  $('#id\\#b')

2.属性选择器@符号问题

2.5.2 选择器中含有空格的注意事项

$('.test :hidden') //后代选择器,class为‘test’的元素里面的隐藏元素;

$('.test:hidden')//过滤选择器,隐藏的class为‘test’元素

2.6 案例研究

show();css(name,value);text(string);addClass(class);hide();removeClass();

filter(expr);与find();区别

toggle();

2.7 其他选择器

querySelectorAll();

第3章 jQuery中的DOM操作

1.DOM Core

2.HTML-DOM

3.CSS-DOM

3.2jQuery中的DOM操作

3.2.1查找节点

1.查找元素节点

var $li = $('ul li:wq(1)');

var li_text = $li.text();

2.查找属性节点

var $para = $('p')

var p_text = $.attr('title')

3.2.2创建节点

1.创建元素节点 

$(html) ; //  $('<li></li>')

$('ul').append($li_1);

2.创建文本节点

$('<li>香蕉</li>')

3.创建属性节点

$('<li title='香蕉'>香蕉</li>')

3.2.3 插入节点

append();

appendTo();

prepend();

prependTo();

after();

insertAfter();

before();

insertBefore();

3.2.4 删除节点

1.remove();

2.detach();// 与1不同,会保留绑定的事件,附加的数据

3.empty()

3.2.5复制节点

clone(); // $(this).clone(true).appendTo('body');

3.2.6替换节点

replaceWith();

replaceAll();

3.2.7包裹节点

wrap();单独包裹

wrap();一起包裹

wraplnner();

3.2.8属性操作

attr();removeAttr();

3.2.9样式操作

1.获取样式和设置样式

2.追加样式

addClass();

3.移除样式

removeClass(); //可以传递多个参数 空格隔开,没有参数删除全部

4.切换样式

toggeleClass();

5.判断是否有某个样式

hasClass(); //实际上使用is(),目的是增加可读性,效果一样

3.2.10 设置和获取HTML 文本和值

1.html()方法;

2.text()方法;

3.val()方法;

3.2.11遍历节点

1.chiildren();

2.next();

3.prev();

4.siblings(); //所有同辈元素

5.cloest();  //从本级(包含),向上查找

6.parent() parents() closest()区别

3.2.12 CSS-DOM操作

1.offset();

2.position;

3.scrollTop();scrollLeft();

3.3案例研究

div取代title提示

div取代title提示,图片效果

第4章 jQuery中的事件和动画

4.1加载DOM

$(document).ready();

4.1.2事件绑定

bind();

is(‘:visible’)

3.改变绑定事件的类型

4.简写绑定事件

4.1.3合成事件

hover(enter,leave);

toggle(fn1,fn2,...fnN);

4.1.4 事件冒泡

event.stopPropagation();

event.preventDefault();

可以简写为return false;

jQuery不支持事件捕获;

4.1.5 事件对象的属性

evebt.type ;event.target; event.relatedTarget;event.pageX;event.pageY;

4.1.6 移除事件

unbind():

4.1.7 模拟操作

trigger();

触发自定义事件

4.2jQuery中的动画

4.2.1 show()和hide()

4.2.2fadeIn()和fadeOut()

4.2.3 slideUp();slideDown();

4.2.2 自定义动画方法animate()

animate(params,speed,callback)

4.2.5 动画回调函数

使用回调函数对非和动画方法实现排队

function(){$(this).css()}

4.2.6 停止动画和判断是否处于动画状态

4.3 视频展示效果

第5章 jQuery对表单...

第6章 jQuery与Ajax的应用

6.1 Ajax的优势与不足

6.2 Ajax的XMLHttpRequest对象

6.5 jQuery中的Ajax

6.5.1 load()方法

6.5.2 $.get();$.post()

6.5.3 $.getScript();$.getJson()

5.5.4 $.ajax()

6.6 序列化元素

(233之后没兴趣啃下去了)

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  •   JavaScript 与 HTML 之间的交互是通过事件实现的。   事件,就是文档或浏览器窗口中发生的一些特...
    霜天晓阅读 8,864评论 1 11
  • 1.JQuery 基础 改变web开发人员创造搞交互性界面的方式。设计者无需花费时间纠缠JS复杂的高级特性。 1....
    LaBaby_阅读 5,222评论 0 2
  • 1.JQuery 基础 改变web开发人员创造搞交互性界面的方式。设计者无需花费时间纠缠JS复杂的高级特性。 1....
    LaBaby_阅读 4,913评论 0 1
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 28,049评论 1 45
  • 最近写了个web浏览器 参考博文和源码下载地址: https://write-bug.com/article/13...
    ggdd5151阅读 3,122评论 0 0