zoukankan      html  css  js  c++  java
  • jquery动态操作元素


    <!DOCTYPE html>


    <html lang="en" xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta charset="utf-8" />
        <title></title>
        <script src="jquery-1.7.1.min.js"></script>
        <script>
            $(function () {
                $('#btnAppend').click(function () {
                    var b = $('<b>zhh</b>');
                    $('#dv').append(b);
                });
                $('#btnAppendTo').click(function () {
                    $('<b>zhh</b>').appendTo($('#dv'));
                });


                $('#btnPrepend').click(function () {
                    var b = $('<b>zhh</b>');
                    $('#dv').prepend(b);
                });


                $('#btnPrependTo').click(function () {
                    $('<b>zhh</b>').prependTo($('#dv'));
                });


                $('#btnAfter').click(function () {
                    var b = $('<b>zhh</b>');
                    $('#dv').after(b);
                });


                $('#btnInsertAfter').click(function () {
                    $('<b>zhh</b>').insertAfter($('#dv'));
                });


                $('#btnBefore').click(function () {
                    var b = $('<b>zhh</b>');
                    $('#dv').before(b);
                });


                $('#btnInsertBefore').click(function () {
                    $('<b>zhh</b>').insertBefore($('#dv'));
                });


                $('#btnEmpty').click(function () {
                    $('#dv').empty();
                });








            });
        </script>
    </head>
    <body>
        <input type="button" name="name" value="Append "  id="btnAppend"/>
        <input type="button" name="name" value="AppendTo "  id="btnAppendTo"/>
        <input type="button" name="name" value="Prepend "  id="btnPrepend"/>
        <input type="button" name="name" value="PrependTo "  id="btnPrependTo"/>
         <input type="button" name="name" value="After "  id="btnAfter"/>
        <input type="button" name="name" value="InsertAfter "  id="btnInsertAfter"/>
        <input type="button" name="name" value="before "  id="btnBefore"/>
        <input type="button" name="name" value="InsertBefore "  id="Button1"/>
        <input type="button" name="name" value="Empty "  id="Button2"/>


        <div id="dv">
          Hello world
        </div>
    </body>
    </html>
  • 相关阅读:
    【Linux】【Services】【Configuration】puppet
    【Linux】【Services】【Web】Haproxy
    【Linux】【Services】【Project】Haproxy Keepalived Postfix实现邮件网关Cluster
    【Linux】【Services】【Web】Nginx基础
    【Linux】【Services】【Project】Cobbler自动化装机
    【Linux】【Services】【Package】rpm包制作
    【Linux】【Services】【nfs】nfs安装与配置
    Bootstrap框架--DataTables列表示例--添加判断
    安全整改相关内容
    tomcat禁用PUT,DELETE等一些不必要的HTTP方法
  • 原文地址:https://www.cnblogs.com/dxmfans/p/9434705.html
Copyright © 2011-2022 走看看