JQ的几组API辨析:

时间:2022-03-18 07:20:15

Jq的插入一共有八个API可供选择,结果相类似,下面将以例子,简单明了的介绍下用法:

<select multiple="multiple">

      <option value="">1</option>

      <option value="">2</option>

      <option value="">3</option>

      <option value="">4</option>

</select>

<select multiple="multiple">

      <option value="">5</option>

</select>

 

需求:在2前面插入5;

这里面就将

$("select[name=one] option:eq(0) ")简写为1;

$("select[name=one] option:eq(1) ")简写为2;

$("select[name=two] option:eq(0) ")简写为5;

2 .before 5;

1 .after 5;

5 .insertBefore 2;

5 insertAfter 1;

以上4个均可以完美完成需求,不同的是前后之分和主体不同。

注:在原生js中也有insertBefore,但是没有insertAfter。

1 .append 5;

5 .appendTo 1;

2 .prepend 5;

5 .prependTo 2;

以上4个貌似也可以完成插入效果上有很大的不同,append 、prepend是将5插入到2的标签内部,在使用时可根据需求加以选择。

 

2.ready和onload

功能:两者是一致的;

用法:$(document).ready(function(){});

简写$(function(){});

Window.onload=function(){};

ready和onload是文档准备API前者是jq API,,后者是js API,其更大的区别在于:

1、ready有简写;

2、ready的响应速度快于onload,原因是ready只需DOM结构加载完后执行,而onload需将页面内容加载完成后执行,显然页面内容多于DOM结构,例如:图片等;

3、一个页面允许有多个ready,而只能有一个window.onload。

JQ的几组API辨析: