jQuery文档操作方法对比

 <!DOCTYPE html>
 <html>
 <head>
 <meta charset="UTF-8">
 <title>Insert title here</title>
 <script type="text/javascript" src="js/jquery-3.3.1.js"></script>
 <script type="text/javascript">
     $(document).ready(function(){
         $("div").after("<p>我是after方法插入过来的</p>");
         $("div").append("<p>我是append方法插入过来的</p>");
         $("div").before("<p>我是before方法插入过来的</p>");
         $("div").prepend("<p>我是prepend方法插入过来的</p>");
         $("div").append("<p>我是append方法第二次插入过来的</p>");
         $("div").after("<p>我是after方法第二次插入过来的</p>");
     })
 </script>
 </head>
 <body>
 <div style="height:200px; width:200px; border:2px solid;"></div>
 </body>
 </html>

调试

备注

after()和before()方法只能在标签后面插入；prepend()和apppend()方法可以在标签内插入

前者只能在固定的位置（即永远都是在标签后一个位置插入）；后者可以连续加入（即依次累加在标签内）

jQuery使用时src的写法

本地：若jQuery.js文件与HTML文件在同一个文件夹中，src="jQuery.js"

若jQuery.js文件所在的文件夹与HTML文件在同一个目录，src="文件夹/jQuery.js"

若jQuery.js文件所在的文件夹与HTML文件所在的文件夹为同一个目录，src="../文件夹/jQuery.js"

也可以直接写入jQuery.js文件的详细路径

非本地：

从 Google 或 Microsoft 加载 CDN jQuery 核心文件

Microsoft的jQuery库

src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.min.js"

Google的jQuery库

src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js"

jQuery文档操作方法对比和src写法的更多相关文章

  1. jQuery 文档操作方法

    jQuery 文档操作方法 这些方法对于 XML 文档和 HTML 文档均是适用的,除了:html(). 方法 描述 addClass() 向匹配的元素添加指定的类名. after() 在匹配的元素之 ...

  2. 原生JS与jQuery文档加载完毕的写法

    HTML是有执行顺序的,默认是自上而下执行.所以当我们的js代码在html代码下边的时候,可以正常执行,而当我们的js代码在html代码上边的时候,可以就无法正常执行了,这时,我们需要在文档加载完毕的 ...

  3. jquery文档加载几种写法，图片加载写法

    jquery文档加载写法: $(function(){ }) ; //个人最常使用方式 $(document).ready(function(){ }); //调用文档对象下的ready方法传入一个函 ...

  4. jQuery 文档操作方法(append)

    这些方法对于 XML 文档和 HTML 文档均是适用的,除了:html(). 一.append() 方法 append() 方法在被选元素的结尾(仍然在内部)插入指定内容. 例子: <html& ...

  5. jQuery 文档操作方法(w3school)

    这些方法对于 XML 文档和 HTML 文档均是适用的,除了:html(). 方法 描述 addClass() 向匹配的元素添加指定的类名. after() 在匹配的元素之后插入内容. append( ...

  6. jQuery 文档操作方法 （四）

    方法 描述 addClass() 向匹配的元素添加指定的类名. after() 在匹配的元素之后插入内容. append() 向匹配元素集合中的每个元素结尾插入由参数指定的内容. appendTo() ...

  7. jQuery的文档操作方法

    jQuery 文档操作方法 这些方法对于 XML 文档和 HTML 文档均是适用的,除了:html(). 方法 描述 addClass() 向匹配的元素添加指定的类名. after() 在匹配的元素之 ...

  8. jQuery 效果函数，jquery文档操作，jQuery属性操作方法，jQuerycss操作函数，jQuery参考手册-事件，jQuery选择器

    jQuery 效果函数 方法 描述 animate() 对被选元素应用“自定义”的动画 clearQueue() 对被选元素移除所有排队的函数(仍未运行的) delay() 对被选元素的所有排队函数( ...

  9. jQuery 文档操作 - prependTo() ，appendTo()方法

    其他jquery文档操作方法:http://www.w3school.com.cn/jquery/jquery_ref_manipulation.asp jQuery 参考手册 - 文档操作 appe ...

随机推荐

  1. 2019swpuj2ee作业2--HTTP协议

    简介: HTTP协议:超文本传输协议.它允许将超文本标记语言(HTML)文档从Web服务器传送到客户端的浏览器.在七层模型中属于应用层.是一种请求/响应式的协议. 主要特点:   (1)支持客户端/服 ...

  2. cobbler学习

    note.youdao.com/share/?id=2f8383d6e9824929012b041f069da26e&type=note#/ IPADDR=192.168.86.4 TYPE= ...

  3. Ngui使用随心记

    Ngui的一些基础使用心得! BB:首先BB一下我觉得NGUI和UGUI哪个好?我首推UGUI,先不说是官方内置,在使用的方便性上也要好很多,而且NGUI停止更新了!还有就是NGUI有BUG! Ngu ...

  4. 2.DI依赖注入

    一:DI Dependency Injection ,依赖注入 is a :是一个,继承. has a:有一个,成员变量,依赖. class B { private A a;   //B类依赖A类 } ...

  5. git 命令(补充篇)的本质理解

    1 标签, git tag tag_name SHA 本质: 在某次commit 上打上标签tag_name ,标签在代码库中起着"锚点"的作用. 注意: commit 由 SHA ...

  6. Android开发 - 掌握ConstraintLayout（五）偏差(Bias)

    比如实现这样一个场景: "在屏幕宽度的1/4的地方放置一个View" 使用传统布局时,实现按照屏幕的宽度(高度),或者相对两个View之间距离的一个比例来进行布局,就显得非常麻烦, ...

  7. 2.html基础标签:无序+有序+自定义列表

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. Eclipse 中 Java 代码报版本错误的问题

    今天碰到了eclipse中的代码一直报错,后来发现是编译环境的问题,记录一下. 项目build path的JDK版本是开发的时候编译器需要使用到的,例如,如果用的JDK1.4就不能使用泛型. 而jav ...

  9. CentOS 配置SOCKS5代理服务

    SOCKS5 是一个代理协议,它在使用TCP/IP协议通讯的前端机器和服务器机器之间扮演一个中介角色,使得内部网中的前端机器变得能够访问Internet网中的服务器,或者使通讯更加安全 通过yum安装 ...

  10. Maven - 实例-4-依赖传递

    这里以Eclipse创建Maven工程来演示. Setp-1 创建Maven项目 File ---> New ---> Maven Project ---> 默认勾选"Us ...