jq中DOM文档处理常用方法,内部外部插入DOM元素
来源:原创
时间:2015-08-26
作者:脚本小站
分类:JS/JQuery
内部外部插入DOM元素,删除与替换DOM元素
//=====================DOM文档处理============================ //---------------------内部插入------------------------------- $('p').append('<div></div>')// 将div添加到p当中 $('p').appendTo('#id') // 将p添加到#id当中 $('div').prepend('<p></p>') // 将p添加到div中的第一个 $('div').prependTo('#id') // 将div插入到#id当中 //------------------------------------------------------------ //---------------------外部插入------------------------------- $('p').after('<div></div>') //div在p后面 $('p').after($('#foo')[0]) //或 $('p').before('<div></div>') //将p放在div后面 $('p').before($("#foo")[0])//或 $('p').insertAfter('#id') //p放在#id后面 $('p').insertBefore('#id') //p放在#id前面 //------------------------------------------------------------ //-----------------------包裹--------------------------------- $('p').wrap('<div></div>') //div将“所有的”p包围 $('p').unwrap() //wrap的反操作 $('p').wrapall('<div></div>') //div将每一个p包围起来 $('p').wrapInner('<div></div>') //p的“每一个”子内容用div包起来 //------------------------------------------------------------ //------------------------替换-------------------------------- $('p').replaceWith('<div></div>') //将p替换成div $('<div></div>').replaceAll('#id') //将#id替换成div //------------------------------------------------------------ //------------------------删除-------------------------------- $('p').empty() //将p内所有的元素删除 $('p').remove() //将p标签删除 detach() //同remove 事件附加的数据等保留 //------------------------------------------------------------ //-------------------------复制------------------------------- $('p').clone(true) //克隆p并选择被克隆元素,传true复制事件