资讯专栏INFORMATION COLUMN

jQuery 使用小结

未东兴 / 3066人阅读

摘要:一选择器部分选择不同的选择被选中的选择父类元素仅限于直接父类元素只要是父类元素即可,能向父级多级查找选择子类元素选择兄弟元素二插入和删除元素插入在被选元素的结尾插入内容请选择在被选元素的开头插入内容在被选元素之前插入内容在被选元素之后插入内

一、选择器部分

$("input[type="radio"]") 选择不同 typeinput

$("input[type="radio"]:checked") 选择被选中的 radio

选择父类元素

$selector.parent("td") 仅限于直接父类元素 parent

$(this).parents(".content") 只要是父类元素即可,能向父级多级查找 parents

选择子类元素

$ele.children("p.tip");

$this.siblings(".content").find("textarea")

选择兄弟元素 $selector.parent("td").siblings(".title")

二、插入和删除元素 1. 插入

在被选元素的结尾插入内容

 $ele.append("

  请选择

");

在被选元素的开头插入内容

$(".must").prepend("");

在被选元素之前插入内容

$(".item:eq(2)").before($(".milestone"));

在被选元素之后插入内容

$(".item:eq(2)").after($(".milestone"));

2. 删除

remove() 删除被选元素(及其子元素),可传入参数(选择器)作为过滤条件

$tip.remove()` 或 `$("p").remove(".italic");

empty() 删除被选元素的子元素

$tip.empty()

三、设置元素样式 四、动画 1. animate 动画使用固定值
$dialog.animate({
    top: "60px"
})
2. animate 动画使用相对值
$dialog.animate({
    top: "-=60px"
})
3. 判断当前是否有动画尚未执行完毕

如果正在执行动画返回 true

$(".box").is(":animated")

五、获取和设置元素的值

获取文本域的输入的内容

var $val = $this.siblings(".content").find("textarea").val();

获取属性值

var id = $(this).parents(".item").attr("id");

六、其他的一些方法

清空被选中的 radio

$("input[type="radio"]").removeAttr("checked");

判断 radio 是否被选中

$(this).is(":checked")

判断元素是否具有指定的类名

$(this).hasClass("bad")

jQuery 对象有 length 属性,该属性表示选中的 DOM 元素的个数

if($radiosChecked.length != 2) {}

判断选中元素是否为 display:none 状态

if(!$(this).is(":hidden")) {}

序列化表单数据,用于 ajax 提交表单数据

$("form").serialize()

输入框失去焦点

$("input").blur(function () {});

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/84709.html

相关文章

  • jQuery获取和设置checkbox的checked属性小结

    摘要:最近在项目中使用到设置,使用场景是页面上有三类单选框,一个是全选所有页数据一个是选择当前页,一个是选择一条,也算常用的场景。的属性在页面首次加载时就确定。最后,总结下获取和设置属性的方法。 最近在项目中使用到jQuery设置checkbox,使用场景是页面上有三类单选框,一个是全选所有页数据(id=cb1),一个是选择当前页(id=cb2),一个是选择一条(name=cb3),也算常用...

    scola666 评论0 收藏0
  • jQuery 简单小结

    摘要:根据以上信息,简单的总结一下选择符应该是唯一的,不需要添加额外的选择符。利用这一点,可以大大简化事件的绑定。然而,出于一致性考虑,可以简单的全部使用方法。事实上,这种处理完全不必要。我这干脆就简单起个小结吧。 前言 之前一段时间一直在进行旧项目的重构,发现了很多问题,系统用的库是jQuery, 主要是用着方便,其他同事,包括一些外包同事,对这个库也比较熟悉 。这里就对一些常见的问题,结...

    Channe 评论0 收藏0
  • typeahead.js 使用教程小结

    摘要:规定查询时要显示的条目的最大值。用于自动高亮突出显示结果。其值可以是关键字符串,或者是将推荐对象转换为的函数。默认为移除功能,并将元素的状态重置为原始状态。关闭的下拉菜单。实属原创,如有错误,烦请指教 前言:最近有个输入框自动补全的需求,例如百度搜索功能: showImg(https://segmentfault.com/img/bVzusL); 在输入框输入信息后,自动提示补全。我选...

    changfeng1050 评论0 收藏0
  • 面试小结--前端面试的几个雷点

    摘要:前言得益于金三银四,在最近一段时间,面试了一些人,但是符合的寥寥无几。看到我的面试题自己写的面试题,自己想的答案。听人说过一个面试套路面试官问的问题,可能面试官自己都不懂,目的只是为了压工资,挫士气。不过我是为了测试面试者是不是真的精通。 技术在不断的创新,随着框架,库,构建工具,打包工具,版本控制工具等操作越来越方便,使用越来越简单。面对这样的情况,除了兴奋,也要警惕。这些工具使得开...

    idealcn 评论0 收藏0
  • Vue + TypeScript 重构 vue-admin-element 小结

    摘要:从导入外部帮助库比如,等编译过程中打印文件名移除注释允许编译文件解析非相对模块名的基准目录指定特殊模块的路径编译过程中需要引入的库文件的列表 { // 编译选项 compilerOptions: { // 输出目录 outDir: ./output, // 是否包含可以用于 debug 的 sourceMap sourceMap: true, // 以严格模式解析 ...

    khlbat 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<