jquery替换节点和属性操作

jquery替换节点和属性操作

替换节点

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <script src="../../scripts/jquery-1.3.1.js" type="text/javascript"></script>
 <script type="text/javascript">

  $(function(){
     $("p").replaceWith("<strong>你最不喜欢的水果是?</strong>");
     // 同样的实现: $("<strong>你最不喜欢的水果是?</strong>").replaceAll("p");
  });

  </script>
</head>
<body>
    <p title="选择你最喜欢的水果." >你最喜欢的水果是?</p>
    <ul>
      <li title='苹果'>苹果</li>
      <li title='橘子'>橘子</li>
      <li title='菠萝'>菠萝</li>
    </ul>
</body>
</html>
属性操作
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <script src="../../scripts/jquery-1.3.1.js" type="text/javascript"></script>
 <script type="text/javascript">

  $(function(){
      //设置<p>元素的属性'title'
      $("input:eq(0)").click(function(){
            $("p").attr("title","选择你最喜欢的水果.");
      });
      //获取<p>元素的属性'title'
      $("input:eq(1)").click(function(){
            alert( $("p").attr("title") );
      });
      //删除<p>元素的属性'title'
      $("input:eq(2)").click(function(){
            $("p").removeAttr("title");
      });   

  });

  </script>
</head>
<body>
    <input type="button" value="设置<p>元素的属性'title'"/>
    <input type="button" value="获取<p>元素的属性'title'"/>
    <input type="button" value="删除<p>元素的属性'title'"/>


    <p title="选择你最喜欢的水果." >你最喜欢的水果是?</p>
    <ul>
      <li title='苹果'>苹果</li>
      <li title='橘子'>橘子</li>
      <li title='菠萝'>菠萝</li>
    </ul>
</body>
</html>

 

你可能感兴趣的:(jquery替换节点和属性操作)