5.①节点插入（内后append前prepend；外前before后after）删除（empty；remove包括皮）替换replaceWith②事件绑定2种 与解除1种：鼠标mouse滑动移入移出3

目录

一：页面节点的添加/替换元素：

1.内部：选中元素的内部：

*在当前匹配的所有元素内的最后插入指定内容

*在当前匹配的所有元素内的最前面插入指定内容

2.外部：选中元素的前后（兄弟节点）：

*将指定内容插入到当前所有匹配元素的前面

*将指定内容插入到当前所有匹配元素的后面

*用指定内容替换所有匹配的标签

二：页面元素节点的删除

*删除所有匹配元素的子元素文本，标签节点不删：西瓜吃了，皮不吃

*删除所有匹配的元素，标签节也点删：西瓜吃了，皮也吃了

三：事件绑定与解除

1.点击事件的两种绑定：

2.鼠标滑动移入移出：三种

①mouseover，mouseout：注意如果只是进行移入子元素操作，先触发父元素的移出，再触发移入，冒泡

②mouseenter，mouseleave：不冒泡

 ③$('#id').hover(funciton(){},funciton(){})方法的底层，是使用mouseenter和mouseleave实现的,如果没有第二个function,移入移出输出的都是移入

3.解除事件绑定$('#id').off('事件名称1 事件名称2') 

①不传参：默认解除所有事件

②传参：解除指定事件

---

一：页面节点的添加/替换元素：

<ul id="ul1">
    <li>AAAAA</li>

    <li title="hello">BBBBB</li>
    <li class="box">CCCCC</li>

    <li title="hello">DDDDDD</li>
    <li title="two">EEEEE</li>
    <li>FFFFF</li>
  </ul>
  <br>
  <br>
  <ul id="ul2">
    <li class="re">aaa</li>
    <li title="hello">bbb</li>
    <li class="box">ccc</li>
    <li title="hello">ddd</li>
    <li title="two">eee</li>
  </ul>

1.内部：选中元素的内部：

*在当前匹配的所有元素内的最后插入指定内容

    $('#id').append('content')

    $('content').appendTo('#id')

*在当前匹配的所有元素内的最前面插入指定内容

    $('#id').prepend('content') 

    $('content').prependTo('#id')

2.外部：选中元素的前后（兄弟节点）：

*将指定内容插入到当前所有匹配元素的前面

    $('#id').before('content')

*将指定内容插入到当前所有匹配元素的后面

    $('#id').after('content') 

*用指定内容替换所有匹配的标签

    $('#id').replaceWith('content')

二：页面元素节点的删除

原始模样：

*删除所有匹配元素的子元素文本，标签节点不删：西瓜吃了，皮不吃

    $('#id').empty()

*删除所有匹配的元素，标签节也点删：西瓜吃了，皮也吃了

    $('#id').remove()

三：事件绑定与解除

1.点击事件的两种绑定：

2.鼠标滑动移入移出：三种

①mouseover，mouseout：注意如果只是进行移入子元素操作，先触发父元素的移出，再触发移入，冒泡

 

②mouseenter，mouseleave：不冒泡

 ③$('#id').hover(funciton(){},funciton(){})方法的底层，是使用mouseenter和mouseleave实现的,如果没有第二个function,移入移出输出的都是移入

 

3.解除事件绑定$('#id').off('事件名称1 事件名称2') 

①不传参：默认解除所有事件

②传参：解除指定事件