宝哥软件园

jQuery插入节点和移动节点使用示例(插入后 插入前方法)

编辑:宝哥软件园 来源:互联网 时间:2021-09-07

本文阐述了jQuery插入节点和移动节点的方法。分享给大家参考,如下:

1.插入节点:

html healtheta http-equiv=' Content-Type ' Content=' text/html;charset=utf-8 '/title/title script src=' http : js/jquery-1 . 10 . 1 . min . js ' type=' text/JavaScript '/script script type=' text/JavaScript '/![CDATA[$(function(){ var $ Li _ 1=$(' Li title=' banana ' banana/Li ');//创建第一个li元素var $li_2=$('li title=' Sydney '悉尼/Li ');//创建第二个li元素var $ Li _ 3=$(' Li title=' other ' other/Li ');//创建第三个li元素var $ parent=$(' ul ');//获取ul节点,即父节点var $ two _ Li=$(' ul Li : eq(1)');//获取ul节点中的第二个li元素节点$ parent . append($ Li _ 1);append方法将创建的第一个li元素添加到父元素的最后一个$parent.prepend($li_2)中;prepend方法将创建的第二个li元素添加到父元素的前面,$ Li _ 3 . insertafter($ two _ Li);//insertAfter方法在获取的li}之后插入创建的第三个li元素);//]]/script/head dyp title='选择你最喜欢的水果'你最喜欢什么水果?/pul Li title=' apple ' apple/Li Li title=' orange ' orange/Li Li title='菠萝'菠萝/li/ul/body/html渲染图:

2.移动节点:

html healtheta http-equiv=' Content-Type ' Content=' text/html;charset=utf-8 '/title/title script src=' http : js/jquery-1 . 10 . 1 . min . js ' type=' text/JavaScript '/script script type=' text/JavaScript '/![CData[$(function(){ var $ one _ Li=$(' ul Li : eq(1)'));//获取第二个li元素节点var $ two _ Li=$(' ul Li : eq(2)');//获取ul节点中的第三个li元素节点$ two _ Li . insert before($ one _ Li);//移动节点});//]]/script/head dyp title='选择你最喜欢的水果'你最喜欢什么水果?/pul Li title=' apple ' apple/Li Li title=' orange ' orange/Li Li title='菠萝'菠萝/li/ul/body/html渲染图:

更多对jQuery感兴趣的读者,请查看本网站主题:《jQuery常见事件用法与技巧总结》、《jQuery常用插件及用法总结》、《jQuery操作json数据技巧汇总》、《jQuery扩展技巧总结》、《jQuery拖拽特效与技巧总结》、《jQuery表格(table)操作技巧汇总》、《jQuery常见经典特效汇总》、《jQuery动画与特效用法总结》、《jquery选择器用法总结》。

希望本文对大家的jQuery程序设计有所帮助。

更多资讯
游戏推荐
更多+