zoukankan      html  css  js  c++  java
  • jquery操作DOM 元素(2)

    .after()
      在匹配的元素集合中的每个元素后面插入参数指定的内容,作为其兄弟节点。
      .after(content[,content])
        content HTML字符串 DOM 元素 元素数组 对象,用来插入到集合中每个匹配元素的后面。
        content HTML字符串 DOM 元素 元素数组 对象,用来插入到集合中每个匹配元素的后面。
      .after(function)
        function 返回一个 HTML字符串 DOM 元素 元素数组 对象,用来插入到集合中每个匹配元素的后面。 this指向中当前位置。
      结构:

     <div class="container">
          <h2>Greetings</h2>
          <div class="inner">Hello</div>
          <div class="inner">Goodbye</div>
        </div>
        $('.inner').after('<p>Test</p>');

      效果:

       <div class="container">
          <h2>Greetings</h2>
          <div class="inner">Hello</div>
          <p>Test</p>
          <div class="inner">Goodbye</div>
          <p>Test</p>
        </div>

    .before()
      根据参数设定,在匹配参数的前面插入插入内容。
      .after(content[,content])
        content HTML字符串 DOM 元素 元素数组 对象,用来插入到集合中每个匹配元素的后面。
        content HTML字符串 DOM 元素 元素数组 对象,用来插入到集合中每个匹配元素的后面。
      .after(function)
        function 返回一个 HTML字符串 DOM 元素 元素数组 对象,用来插入到集合中每个匹配元素的后面。 this指向中当前位置。
      结构:

        <div class="container">
          <h2>Greetings</h2>
          <div class="inner">Hello</div>
          <div class="inner">Goodbye</div>
        </div>
        $('.inner').before('<p>Test</p>');

      效果:

       <div class="container">
          <h2>Greetings</h2>
          <p>Test</p>
          <div class="inner">Hello</div>
          <p>Test</p>
          <div class="inner">Goodbye</div>
        </div>

    .insertAfter()
      在目标元素的后面插入集合中每个匹配的元素,插入的元素作为目标元素的兄弟元素。
      .insertAfter(target)
        target 一个选择器,元素,HTML字符串或者对象,匹配的元素将会被插入在由参数指定的目标后面。
      结构:

       <div class="container">
          <h2>Greetings</h2>
          <div class="inner">Hello</div>
          <div class="inner">Goodbye</div>
        </div>
        $("<p>Test</p>").insertAfter('.insertAfter');

      效果:

       <div class="container">
          <h2>Greetings</h2>
          <div class="inner">Hello</div>
          <p>Test</p>
          <div class="inner">Goodbye</div>
          <p>Test</p>
        </div>

    .insertBefore()
      在目标元素的前面插入集合中每个匹配的元素,插入的元素作为目标元素的兄弟元素。
      .insertBefore(target)
          target 一个选择器,元素,HTML字符串或者对象,匹配的元素将会被插入在由参数指定的目标前面。
      结构:

        <div class="container">
          <h2>Greetings</h2>
          <div class="inner">Hello</div>
          <div class="inner">Goodbye</div>
        </div>
        $("<p>Test</p>").insertBefore('.insertAfter');

      效果:
       

  • 相关阅读:
    .Net内存回收
    select rank() over
    Android中如何区分界面组件创建和销毁的类型
    Thread和Runnable的区别
    Intent对象若干数据项的含义总结
    libcurl用法
    Hadoop 使用Combiner提高Map/Reduce程序效率
    Struts2中的get、set方法作用:
    struts2 使用jsonplugin
    struts.custom.i18n.resources国际化详解(一)
  • 原文地址:https://www.cnblogs.com/nmxs/p/4932378.html
Copyright © 2011-2022 走看看