JavaScript DHTML/jQuery/wrap — различия между версиями

Материал из Web эксперт
Перейти к: навигация, поиск
м (1 версия)
 
(нет различий)

Текущая версия на 07:24, 26 мая 2010

Wrap a new b around all of the paragraphs.

  

<html>
  <head>
    <script type="text/javascript" src="js/jquery-1.3.2.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
          $("p").wrap("<b></b>");
                
         
        });
    </script>
    
  </head>
  <body>
    <body>
         <b>asdf</b>
         <p>asdf: </p>
         
    </body>
</html>



Wrap another tag

     
<html>
  <head>
    <script type="text/javascript" src="js/jquery-1.3.2.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            $("p").wrap("<div>asdf</div>");
        });
    </script>
  </head>
  <body>
    <body>
         <p>a</p><div id="foo">b</div>
  </body>
</html>



wrap(elem): Wrap each matched element with the specified element.

  

<html>
  <head>
    <script type="text/javascript" src="js/jquery-1.3.2.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
          $("p").wrap(document.createElement("b"));
                
         
        });
    </script>
    
  </head>
  <body>
    <body>
         <b>asdf</b>
         <p>asdf: </p>
         
    </body>
</html>



wrap(html): injecting additional structure into a document

  

<html>
  <head>
    <script type="text/javascript" src="js/jquery-1.3.2.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
          $("p").wrap("<b></b>");
                
         
        });
    </script>
    
  </head>
  <body>
    <body>
         <b>asdf</b>
         <p>asdf: </p>
         
    </body>
</html>



Wrap p with div tag

 

<html>
  <head>
    <script type="text/javascript" src="js/jquery-1.3.2.js"></script>
    <script type="text/javascript">
$(document).ready(
  function() {
    $("p").wrap("<div></div>");
  }
);
    </script>
    <style type="text/css">
h4, p {
    margin: 5px;  
}
div {
    background: #fedd58;
    border: 1px solid #ebcb49;
    margin: 3px;
}
    </style>
  </head>
  <body>
    <p>
      asdf
    </p>
  </body>
</html>



Wrap to create and add a border

     
<html>
  <head>
    <script type="text/javascript" src="js/jquery-1.3.2.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
              $("p").wrap("<div></div>");

        });
    </script>
  <style>
      div { border: 2px solid blue; }
  </style>
    
  </head>
  <body>
    <body>
         <p>Hello</p>
  </body>
</html>