java学习

java学习

 

jquery查找和创建节点

得到元素的值
<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(){
      var $para = $("p");            // 获取<p>节点
      var $li = $("ul li:eq(1)");   // 获取第二个<li>元素节点

      var p_txt = $para.attr("title"); // 输出<p>元素节点属性title
      var ul_txt =  $li.attr("title");    // 获取<ul>里的第二个<li>元素节点的属性title
      var li_txt =  $li.text();       // 输出第二个<li>元素节点的text
         alert(p_txt);
      alert(ul_txt);
      alert(li_txt);
    
  });
 
  </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" />
<title>3-2-3</title>
 <!--   引入jQuery -->
 <script src="../../scripts/jquery-1.3.1.js" type="text/javascript"></script>
 <script type="text/javascript">
  $(function(){
    var $li_1 = $("<li title='香蕉'>香蕉</li>");    //创建一个<li>元素
                                                                        

    //包括元素节点,文本节点和属性节点
                                                                        

    //其中title='香蕉' 就是创建的属性节点
    var $li_2 = $("<li title='雪梨'>雪梨</li>");     //创建一个<li>元素
                                                                        

    //包括元素节点,文本节点和属性节点
                                                                        

    //其中title='雪梨' 就是创建的属性节点  


     var $parent = $("ul");        // 获取<ul>节点。<li>的父节点

     $parent.append($li_1);        // 添加到<ul>节点中,使之能在网页中显示
     $parent.append($li_2);        // 等价于:$parent.append($li_1).append($li_2);
  });

  </script>
</head>
<body>

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

</body>
</html>

posted on 2013-03-18 14:44 杨军威 阅读(348) 评论(0)  编辑  收藏


只有注册用户登录后才能发表评论。


网站导航:
 

导航

统计

常用链接

留言簿

随笔档案

搜索

最新评论

阅读排行榜

评论排行榜