JQuery小结

作者: alonwang | 来源:发表于2017-10-19 15:47 被阅读4次

选择器

元素选择器

  • ("p") 选取p元素。

  • $("p.intro") 选取所有 class="intro" 的 p 元素。

  • $("p#demo") 选取所有 id="demo" 的 p 元素。

属性选择器

  • $("[href]") 选取所有带有 href 属性的元素。
  • $("[href='#']") 选取所有带有 href 值等于 "#" 的元素。
  • $("[href!='#']") 选取所有带有 href 值不等于 "#" 的元素。
  • $("[href='.jpg']") 选取所有 href 值以 ".jpg" 结尾的元素。

CSS选择器

  • 把所有 p 元素的背景颜色更改为红色 $("p").css("background-color","red");

事件

当按钮的点击事件被触发时会调用一个函数:

    $("button").click(function() {..some code... } )

名称冲突

jQuery 使用 $符号作为 jQuery 的简介方式。
某些其他 JavaScript 库中的函数(比如 Prototype)同样使用$ 符号。
jQuery 使用名为 noConflict() 的方法来解决该问题。
var jq=jQuery.noConflict(),帮助您使用自己的名称(比如 jq)来代替 $ 符号。

Html

获得(设置)

text()、html() 以及 val()
不带参表示获取数据,带参表示设置内容

添加

  • append() - 在被选元素的结尾插入内容
  • prepend() - 在被选元素的开头插入内容
  • after() - 在被选元素之后插入内容
  • before() - 在被选元素之前插入内容

删除

  • remove() - 删除被选元素(及其子元素)
  • empty() - 从被选元素中删除子元素

获取并设置 CSS 类

  • addClass() - 向被选元素添加一个或多个类
  • removeClass() - 从被选元素删除一个或多个类
  • toggleClass() - 对被选元素进行添加/删除类的切换操作
  • css() - 设置或返回样式属性

尺寸

  • width()
  • height()
  • innerWidth()
  • innerHeight()
  • outerWidth()
  • outerHeight()

遍历

祖先

  • parent() 返回被选元素的直接父元素
  • parents() 返回被选元素的所有祖先元素,它一路向上直到文档的根元素 (<html>)。
  • parentsUntil() 返回介于两个给定元素之间的所有祖先元素。

后代

  • children() 返回被选元素的所有直接子元素
  • find() 返回被选元素的后代元素,一路向下直到最后一个后代。

同胞

  • siblings() 返回被选元素的所有同胞元素
  • next() 返回被选元素的下一个同胞元素
  • nextAll() 返回被选元素的所有跟随的同胞元素
  • nextUntil() 返回介于两个给定参数之间的所有跟随的同胞元素
  • prev()
  • prevAll()
  • prevUntil()

过滤

  • first() 返回被选元素的首个元素
  • last() 返回被选元素的最后一个元素
  • eq() 返回被选元素中带有指定索引号的元素
  • filter() 不匹配这个标准的元素会被从集合中删除,匹配的元素会被返回。
  • not() 返回不匹配标准的所有元素。

Ajax

load

    $(selector).load(URL,data,callback);

get

    $.get(URL,callback);

post

    $.post(URL,data,callback);

相关文章

  • JQuery小结

    一、页面加载 JQ的页面加载比JS要快,当整个dom树结构生成完毕后就会加载 JQ页面加载不存在覆盖问题,加载的时...

  • JQuery小结

    选择器 元素选择器 ("p") 选取p元素。 $("p.intro") 选取所有 class="intro" 的 ...

  • JQuery小结

    努力到无能为力,拼搏到感动自己 ! 一 核心:函数和对象访问 1页面加载函数: 2 JQ与JS页面加载的区别: ...

  • jQuery效果小结

    1. 显示/隐藏 show/hideshow(); hide(),没有参数将会立即显示/隐藏元素,相当于改变元素的...

  • jQuery插件小结

    虽然现如今vue、angular等的框架大行其道,但是jQuery依然还是日常开发非常常用的,而其中插件又是爱不释...

  • 【小结】jQuery事件

    鼠标事件键盘事件其他事件事件参数事件绑定与取消 含fn参数说明有回调函数在里面 鼠标事件-click、dblcli...

  • jQuery使用小结

    jQuery使用 常用的方法总结 1,元素选择器 第一种:向下选择 (1),直接选择紧挨着的子元素$('.元素类名...

  • jQuery 常用方法小结

    jQuery 常用方法小结 each方法 有了隐式迭代,为什么还要使用each函数遍历?

  • jQuery学习小结3(jQuery遍历)

    //获取父元素$(document).ready(function(){$("#button").click(fu...

  • jQuery学习小结1(jQuery效果)

    //名称冲突自己命名var jo=$.noConflict();jo(document).ready(funct...

网友评论

    本文标题:JQuery小结

    本文链接:https://www.haomeiwen.com/subject/dgouuxtx.html