jQuery小练习3

最新推荐文章于 2024-07-23 12:18:01 发布

阅读量397

点赞数

分类专栏： JavaScript 文章标签： jquery

本文链接：https://blog.csdn.net/cckevincyh/article/details/53156165

版权

JavaScript 专栏收录该内容

62 篇文章 0 订阅

订阅专栏

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>ddd</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <script language="JavaScript" src="../js/jquery-1.4.2.js"></script>
    <style type="text/css">
            div,span{
                width: 140px;
                height: 140px;
                margin: 20px;
                background: #9999CC;
                border: #000 1px solid;
                float:left;
                font-size: 17px;
                font-family:Roman;
            }
            div.mini{
                width: 30px;
                height: 30px;
                background: #CC66FF;
                border: #000 1px solid;
                font-size: 12px;
                font-family:Roman;
            }
     </style>

     <!--引入jquery的js库-->
    </head>
    <body>
    <p>段落1</p>
    <p>段落2</p>
    <p>段落3</p>
    <table border=1>
        <tr>
            <td>第1行</td><td>第1行</td>
        </tr>
        <tr>
            <td>第2行</td><td>第2行</td>
        </tr>
        <tr>
            <td>第3行</td><td>第3行</td>
        </tr>
        <tr>
            <td>第4行</td><td>第4行</td>
        </tr>
        <tr>
            <td>第5行</td><td>第5行</td>
        </tr>

        <tr>
            <td>第6行</td><td>第6行</td>
        </tr>
    </table>
    <br><br><br>
    <table border=1>
        <tr>
            <td>第1行</td><td>第1行</td>
        </tr>
        <tr>
            <td>第2行</td><td>第2行</td>
        </tr>
        <tr>
            <td>第3行</td><td>第3行</td>
        </tr>
        <tr>
            <td>第4行</td><td>第4行</td>
        </tr>
        <tr>
            <td>第5行</td><td>第5行</td>
        </tr>
        <tr>
            <td>第6行</td><td>第6行</td>
        </tr>
    </table>        
    </body>
    <script language="JavaScript">

        /*
         * <p>段落1</p>
            <p>段落2</p>
            <p>段落3</p>
         */

        $("p").each(function(index,domEle){
            $(domEle).click(function(){
                alert($(domEle).text());
            });
        });

        $("table:eq(0) tr:even").css("background","pink");

        $("table:eq(1) tr:odd").css("background","blue");


    </script>

</html>

这里写图片描述

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
jQuery小练习3

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html> <head> <title>ddd</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <script language="Java
复制链接

扫一扫

专栏目录