筛选函数

2017-06-26 18:10:00
admin
原创
334
<!DOCTYPE html>

<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Selected Shakespeare Plays</title>

    <style>
		.horizontal { float: left;

                      list-style: none; margin: 10px;
         }
        .sub-level { background: #ccc;

         }
a {
color: #00c;
}
a.mailto {
background: url(http://code.ybao.org/demo/img/jq/email.png) no-repeat right top; padding-right: 18px;
}
a.pdflink {
background: url(http://code.ybao.org/demo/img/jq/pdf.png) no-repeat right top; padding-right: 18px;
}
a.henrylink {
background-color: #fff; padding: 2px;
border: 1px solid #000;
}
a.external {
background: #fff url(http://code.ybao.org/demo/img/jq/external.png) no-repeat 100% 2px; padding-right: 16px;
}
	</style>

    <script src="http://code.ybao.org/js/jquery.js"></script>
    <script>
	$(document).ready(function() {
      $('#selected-plays > li').addClass('horizontal');
      $('#selected-plays li:not(.horizontal)').addClass('sub-level');
	  $('a[href^="mailto:"]').addClass('mailto');
      $('a[href$=".pdf"]').addClass('pdflink');
	  $('a[href^="http"][href*="henry"]').addClass('henrylink');
		$('a').filter(function() {
return this.hostname && this.hostname != location.hostname;
}).addClass('external');
    });
	</script>
  </head>
  <body>
    <div id="container">
      <h2>Selected Shakespeare Plays</h2>
      <ul id="selected-plays" class="clear-after">
        <li>Comedies
          <ul>
            <li><a href="/asyoulikeit/">As You Like It</a></li>
            <li>All's Well That Ends Well</li>
            <li>A Midsummer Night's Dream</li>
            <li>Twelfth Night</li>
          </ul>
        </li>
        <li>Tragedies
          <ul>
            <li><a href="hamlet.pdf">Hamlet</a></li>
            <li>Macbeth</li>
            <li>Romeo and Juliet</li>
          </ul>
        </li>
        <li>Histories
          <ul>
            <li>Henry IV (<a href="mailto:henryiv@king.co.uk">email</a>)
              <ul>
                <li>Part I</li>
                <li>Part II</li>
              </ul>
            </li>
            <li><a href="http://www.shakespeare.co.uk/henryv.htm">Henry V</a></li>
            <li>Richard II</li>
          </ul>
        </li>
      </ul>

      <h2>Shakespeare's Plays</h2>
      <table>
        <tr>
          <td>As You Like It</td>
          <td>Comedy</td>
          <td></td>
        </tr>
        <tr>
          <td>All's Well that Ends Well</td>
          <td>Comedy</td>
          <td>1601</td>
        </tr>
        <tr>
          <td>Hamlet</td>
          <td>Tragedy</td>
          <td>1604</td>
        </tr>
        <tr>
          <td>Macbeth</td>
          <td>Tragedy</td>
          <td>1606</td>
        </tr>
        <tr>
          <td>Romeo and Juliet</td>
          <td>Tragedy</td>
          <td>1595</td>
        </tr>
        <tr>
          <td>Henry IV, Part I</td>
          <td>History</td>
          <td>1596</td>
        </tr>
        <tr>
          <td>Henry V</td>
          <td>History</td>
          <td>1599</td>
        </tr>
      </table>
      <h2>Shakespeare's Sonnets</h2>
      <table>
        <tr>
          <td>The Fair Youth</td>
          <td>1–126</td>
        </tr>
        <tr>
          <td>The Dark Lady</td>
          <td>127–152</td>
        </tr>
        <tr>
          <td>The Rival Poet</td>
          <td>78–86</td>
        </tr>
      </table>
    </div>
  </body>
</html>
文章分类
联系我们
电话: 18902328227
Email: 2689701946@qq.com
QQ: 2689701946
微信: 18902328227
地址: 广州番禺区繁华路
  • 在线客服
  • 关注微信
  • 联系电话
    • 欢迎咨询
    • 欢迎加入QQ群 303257430
  • 公众号:源宝网络
    • 联系电话及微信号 18902328227