Jquery的appendTo和after区别和应用

appendTo(content)解释为：

把所有匹配的元素追加到另一个指定的元素元素集合中。实际上，使用这个方法是颠倒了常规的$(A).append(B)的操作，即不是把B追加到A中，而是把A追加到B中。

 

Api上的例子:

HTML 代码:外语屋

<p>I would like to say: </p>
<div></div><div></div>


jQuery 代码:

$("p").appendTo("div");


结果:

<div><p>I would like to say: </p></div>
<div><p>I would like to say: </p></div>


实际应用：

   <s:iterator value="classGradeList">
    $("<option>"+"<s:property value='gradeName' />"+"</option>").appendTo("#gradeId").val("<s:property value='gradeId' />");
         </s:iterator>

上面是用到了struts2，classGradeList为后台返回的一个list集合，里面含有两个属性'gradeName' ，和gradeId。得到结果则为后台返回的所有学年度的下拉框。

 

 

after(content)解释

在每个匹配的元素之后插入内容。tbw淘宝网

API例子:
HTML 代码:

<p>I would like to say: </p>

jQuery 代码:

$("p").after("<b>Hello</b>");

结果:

<p>I would like to say: </p><b>Hello</b>

 

实际应用：

$.ajax({
   url:"/school_class/studentInfoAction_validatorCode.action?studentInfoVo.studentNo="+$("#studentNo").val()+"&studentInfoVo.studentinfoId="+$("#id").val(),
   type:"post",
   async:false,
   timeout:3000,
   success:function(html) {
    resultMess=html;
    if(html==""){
         $("#studentNoMess").after("<span id='loadmsg' style='color: green'>可以使用</span>");
        $("#allow").show();
    }else{
        $("#studentNo").focus();
    }
   }
  });

页面中有个div 它的Id为studentNoMess，功能是检查学号是否有重复的例子。