jquery随记（DOM操作）---移动元素（添加标注、编号和连接到上下文）

最新推荐文章于 2022-07-29 11:36:13 发布

bzuld

最新推荐文章于 2022-07-29 11:36:13 发布

阅读量626

点赞数

分类专栏： jquery---随记文章标签： jquery class generation stylesheet function xhtml

本文链接：https://blog.csdn.net/bzuld/article/details/6718907

版权

jquery---随记专栏收录该内容

19 篇文章 0 订阅

订阅专栏

**********************************************************************************

each()函数为每个都添加；

appendTo()函数为添加到；

append()函数为在后面添加；

***********************************************************************************

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<link rel="stylesheet" type="text/css" href="Untitled-2.css" />
<script type="text/javascript" src="jquery-1.6.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
//移动元素
//$('span.footnote').insertBefore('#footer');
$('<ol id="notes"></ol>').insertAfter('div.chapter');
$('span.footnote').each(function(index){
  $(this)
   .before(
    ['<a href="#foot-note-'+(index+1)+
     '" id="context-'+(index+1)+
     '" class="context">',
     '<sup>'+(index+1)+'</sup>',
     '</a>'
    ].join('')
   )
   .appendTo('#notes')
   .append(' (<a href="#context-'+(index+1)+'">context</a>)') ;
  });
});
</script>
</head>
<body>
<h1 id="f-title">Flatland:A Romance of Many Dimensions</h1>
<div id="f-author">by Edwin A.Abbott</div>
<h2>Part 1,Section 3</h2>
<h3 id="f-subtitle">
Concerning the Inhabitants of Flatland
   </h3>
   <div id="excerpt">an excerpt</div>
   <div class="chapter">
     <p class="square">Our Professional Men and Gentlemen are
        Squares (to which class I myself belong) and Five-Sided
            Figures or
            <a href="http://en.wikipedia.org/wiki/Pentagon">Pentagons</a>
         </p>
         <p class="nobility hexagon">Next above these come the
         Nobility,of whom there are several degrees,beginning at
            Six-Sided Figures ,or <a href="http://en.wikipedia.org/wiki/Hexagon">Hexagons</a>
            and from thence rising in the number of their sides till
            they receive the honourable title of
            <a href="http://en.wikipedia.org/wiki/Circle">circle</a> ,he is included in the
            Circular or Priestly order;and this is the highest class of all.
          </p>
          <p><span class="pull-quote"> It is a <span class="drop">Law of Nature</span>
            with us that a male child shall have
                <strong> one more side </strong> than his father </span>,so
                that each generation shall rise (as a rule) one step in
                the scale of development and nobility.Thus the son of a
                Square is a Pentagon ;the son of a Pentagon, a Hexagon;
                and so on.
          </p>
          <p>Our Professional Men and Gentlemen are
        Squares (to which class I myself belong) and Five-Sided
            Figures or
            <a href="http://en.wikipedia.org/wiki/Pentagon">Pentagons1</a>
         </p>
         <p> Rarely—in proportion to the vast numbers of Isosceles
         births—is a genuine and certifiable Equal-Sided
             Triangle produced from Isosceles parents.
             <span class="footnote"> "What need of a certificate?" a Spaceland
             critic may ask:"Is no t the procreation of a Square Son a
             certificate from Nature herself,proving the Equalsidedness
             of the Father?" I reply that no Lady of any position will
             marry an uncertified Triangle. Qquare offspring has
             sometimes resulted from a slightly Irregular Triangle;
             but in almost every such case the Irregularity of the
             first generation is visited on the third ;which either
             fails to attain the Pentagonal rank, or relapses to the Triangular,</span>
             Such a birth requires, as its antecedents ,not also a long-continued exercise of
             frugality and self-control on the part of the would-be
             ancestors of the coming Equilateral,and a patient,
             systematic,and continuous development of the Isosceles in tellect through many
             generations.
           </p>
           <p>The birth of a True Equilateral Triangle from Isosceles
           parents is the subject of rejoicing in our country for many
            furlongs round.After a strict examination conducted by the
            Sanitary and Social Board,the infant, if certified as
            Regular.is with solemn ceremonial admitted into the class
            of Equilaterals.He is then immediately taken from his
            proun yet sorroing parents and adopted by some childless
            Equilateral.<span class="footnote">The Equilateral is
            bound by oath never to permit the child henceforth to enter
            his former home or so much as to look upon his relations
            again, for fear lest the freshly developed organism may,by
            force of unconscious imitation ,fall back again into his
            hereditary level.</span>
          </p>
          <p>How admirable is the Law of Compensation!
          <span class="footnote">And how perfect a proof of the natural
             fitness and,I may almost say,the divine origin of the
             aristocratic constitution of the States of Flatland!</span>
             By a judicious use of this Law of Nature,the Polygons and
             Circles are almost always able to stifle sedition in its
             very cradle,taking advantage of the irrepressible and
             boundless hopefulness of the human mind.…
          </p>
        <div id="footer">
        </div>

</body>
</html>

bzuld

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
jquery随记（DOM操作）---移动元素（添加标注、编号和连接到上下文）

**********************************************************************************each()函数为每个都添加；appendTo()函数为添加到；append()函数为在后面添加；*
复制链接

扫一扫