zoukankan      html  css  js  c++  java
  • jquery子元素选择器

    <!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>
      <title>子元素选择器</title>
      <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
      <style type="text/css">
      .yang{ border-collapse: collapse; width:500px;height:30px;border:1px solid red;"}
      </style>
      <script  type="text/javascript" src="jquery-1.7.1.min.js"></script>
      <script type="text/javascript">
      /*
        :nth-child(index/even/odd)  //匹配指定索引,或偶数,或奇数的元素(索引从1开始)
        :first-child  //匹配第一个子元素
        :last-child   //匹配最后一个子元素
        :only-child  //如果元素为父元素的唯一子元素则匹配
      */
            window.onload=function(){
            $('#btnOk').click(function(){
                //匹配第一个子元素
                //$('ol li:first-child ').html('水浒传');
    
                //匹配指定索引
                 // $("ol li:nth-child(3)").html('杨在鲁');
    
                 //如果元素为父元素的唯一子元素则匹配
                    $("ol li:only-child").html('杨在鲁');
                });
            };
      </script>
     </head>
     <body>
        <ol>
            <li>三国演义</li>
            <li>西游记</li>
            <li></li>
            <li>红楼梦</li>
        </ol>
            <ol>
            <li></li>
        </ol>
      <hr/>
      <input type="button" id='btnOk' value='确定'  />
     </body>
    </html>
  • 相关阅读:
    C#:foreach语句,yield语句
    C#:委托
    C#:事件
    fckeditor 添加上传附件功能
    电话号码 正则表达式
    设为首页,和加入收藏js代码
    sql中判断时间,精确到秒
    js 日期 星期
    那些惊艳的句子!
    .net 动态页面生成静态页面
  • 原文地址:https://www.cnblogs.com/yangzailu/p/5845682.html
Copyright © 2011-2022 走看看