博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
jquery学习笔记
阅读量:6251 次
发布时间:2019-06-22

本文共 1982 字,大约阅读时间需要 6 分钟。

今天熟悉了jquery,学习了一些常用的函数,此外有做了两个小demo,两个实例的核心原理类似,下面是随手记录的笔记:

/*	jquery 学习笔记 	2014-12-04	*/节点的插入:append()可以实现连缀:$("ul").append(li1).append(li2);在节点的最前端插入(prepend):$("ul").prepend(li3);创建元素可一次性添加属性完毕:var li1=$("
  • 香蕉
  • ");节点的删除:remove() 和 detach() 两者区别:remove()是彻底删除,删除后的节点再追加过来后,绑定的事件不能恢复,而detach()删除后的节点会保留在jquery对象中,追加后绑定的事件和数据都还存在:$("ul li").click(function(){ //为每个li元素绑定了click事件 alert($(this).html()); }); var $deli=$("ul li:eq(0)").detach();//用detach删除 var $deli=$("ul li:eq(0)").remove();//用remove删除后,再追加事件不存在 $deli.appendTo("ul"); //再追加后绑定的事件依然存在empty() 清空节点(只清空不删除)能清空元素中所有后代节点 $("ul").empty(); //
      中的
    • 元素都被清理掉了clone() 复制节点:看下面实例:点击后clone()节点,然后插入到ul $("ul li").click(function(){ //注意:只有点击“最初”被绑定click事件的li才能克隆,新克隆的li标签没有绑定事件,可用live解决 $(this).clone().appendTo("ul"); });注意此处存在绑定事件live()高低版本的问题$("ul li").live("click",function(){ //用live()绑定的事件对于新创建或克隆的方法来说依然有效,而用click,bind绑定则不能 $("
    • newnewnew
    • ").appendTo("ul"); //用创建节点的方式添加元素 $(this).clone().appendTo("ul"); //用克隆的方式创建节点});节点替换 replaceWith() 和replaceAll()replaceWith()$("div").replaceWith("
    • 这里之前是div
    • ");replaceAll()$("
    • 现在用replaceAll
    • ").replaceAll("div");节点包裹wrap()//元素包裹 wrap(), wrapAll(),wrapInner()$("ul").wrap("
      wwww
      ");//用div包裹ul$("strong").wrap("
      "); //用
      包裹,单独包裹:每个都有来包裹wrapAll()$("strong").wrapAll(""); //打包包裹,所有的 只用一个来包裹wrapInner()$("strong").wrapInner("");//包裹的文本元素,效果为: 原本为strong的文本现在被b包裹属性操作:设置属性:attr("属性名","属性值");同时设置多个属性:attr({"class":"classname","title":"titlename","name":"namename"});获取属性:attr("属性名")删除属性:removeAttr("title");节点:children()方法指获取下属子节点,不获取孙子节点next()同级相邻下一个prev()同级相邻上一个siblings()同级兄弟元素parent()获取父元素parents()获取所有父元素(祖先元素)closest()从本身元素开始向上查找,直到找到最近的一个祖元素。小插曲:在设置css("属性名","属性值") 时,如果属性值带有“-”如:background-color,font-size,可写为驼峰形式:backgroundColor,fontSize小插曲:对于超链接提示,标签自带的title属性就是超链接提示。也可自己编写提超链接提示效果以下是自己编写的tooltip源码:

      提示1

      提示2

      自带提示 自带提示 以下是根据上面代码更改的一个图片跟随放大显示效果:

     

    转载于:https://www.cnblogs.com/chayangge/p/4288672.html

    你可能感兴趣的文章
    OC - 缓存 - NSCache - 介绍
    查看>>
    Jenkins+GitHub+fir_cli 一行命令从源码到fir im
    查看>>
    【转】TCP三次握手和四次挥手全过程及为什么要三次握手解答
    查看>>
    [系统资源攻略]IO第一篇-磁盘IO,内核IO概念
    查看>>
    在 CentOS 7 上设置 grub2
    查看>>
    [BZOJ 4129]Haruna’s Breakfast(树上带修改莫队)
    查看>>
    [BZOJ 2140]稳定婚姻(强连通分量)
    查看>>
    人工智能工程师学习路线
    查看>>
    I don't like to be an theorist
    查看>>
    「docker实战篇」python的docker- 抖音视频抓取(上)(24)
    查看>>
    powerdesigner 画出 C++ UML 增加const,static,virtual属性
    查看>>
    12月10日站立会议
    查看>>
    Nginx入门(2)反向代理和负载均衡
    查看>>
    MySQL库表状态查询
    查看>>
    【鲁班学院】干货分享!《面试必备之Mysql索引底层原理分析》
    查看>>
    快捷键
    查看>>
    第十一周项目0-是春哥啊
    查看>>
    poi做一个简单的EXCAL
    查看>>
    几种查询emacs帮助的办法
    查看>>
    MariaDB 数据库
    查看>>