zoukankan      html  css  js  c++  java
  • jQuery操作得到DOM元素

             jQueryDOM操作方面提供了一些函数及其用法,这里就对DOM元素的包装简单说明一下,怎样使用会了,对其它方法也能灵活的使用。以下是一个小样例及其效果图。

    代码例如以下:

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title>演示jquery操作得到的元素</title>
        <%--引入jquery文件--%>
        <script  type ="text/javascript" src ="jquery-2.1.4.js"></script>
        <script  type ="text/javascript">
            $(document).ready(function () {
                //触发onclick事件
                $("#testbutton").click(
                    function () {
                        //使用class为test的元素包裹给定元素
                        $("p").wrap($(".test"));
                    }
                    );
            });
        </script>
        <%--基本样式设定--%>
        <style type ="text/css">
            .test {
            color :white ;
            background-color :#ffd800;
            }
            .wrap {
            background-color :green ;
            }
        </style>
    </head>
    <body>
        <form id="form1" runat="server">
            
        <div id="content">
            <button id="testbutton">測试</button>
            <br /><br />
            <div class ="test"></div>
            <p id ="first">第一段文字,id为first</p>
            <p id ="second">第二段文字。id为second</p>
            <p id ="third">第三段文字,id为third</p>
        </div>
        </form>
    </body>
    </html>
    
      对于jQuery的使用自己要多多实践,这样才干对它了如指掌啊~

  • 相关阅读:
    HDU 2955 Robberies
    HDU 2546 饭卡
    poj 3628 Bookshelf 2
    poj 3624 Charm Bracelet
    celery -1
    ☀【Grunt】插件
    【MooTools】
    【Grunt】
    ↗☻【PHP与MySQL程序设计 #BOOK#】第3章 PHP基础
    【CSS】
  • 原文地址:https://www.cnblogs.com/llguanli/p/6880229.html
Copyright © 2011-2022 走看看