<!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>

jquery动态操作元素的更多相关文章

  1. IE7中使用Jquery动态操作name问题

    问题:IE7中无法使用Jquery动态操作页面元素的name属性. 在项目中有出现问题,某些客户的机器偶尔会有,后台取不到前台的数据值. 然开发和测试环境总是不能重现问题.坑爹之处就在于此,不能重现就 ...

  2. JavaScript 、jQuery动态创建元素的关键字~

    JavaScript动态创建元素: 1.创建元素  如:a 标签 var alink= document.createElement("a"); 2.j添加元素属性 alink.h ...

  3. 解决jquery动态创建元素绑定事件失效问题

    存在问题 在我们使用jquery动态创建元素后往往会遇到一些问题,如: 给.button按钮绑定了点击时间,执行alert:(1); 点击事件代码如下: <script>$("# ...

  4. JQuery中操作元素的属性_对象属性

    我们主要是通过attr去获取元素的属性: 看body内容: <body> <p> 账号:<input type="text" id="una ...

  5. Jquery动态操作checkbox

    问题的由来:html页面中使用checkbox给新建用户授权,然后提交到后台服务器,完成给用户授权.用户授权完成之后,如果用户的权限发生改变管理员需要修改多个用户的权限或查看某用户的权限,点击不同的用 ...

  6. jquery动态创建元素 div元素随垂直滚动条位置变化置顶显示

    刚打开页面效果 拖动滑动条之后效果 页面代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" & ...

  7. jquery 动态 新增 元素 绑定事件

    在jquery1.7以前使用live方法进行绑定,由于年代久远,这里就不介绍了. 在jquery1.7以后我们使用的on方法,这里需要注意的一点就是:如果想让动态生成的元素,都绑上事件,on前面的选择 ...

  8. JQuery动态操作表格

    新人,小白一枚,刚刚参加工作,所以会在这里记录一些遇到的问题. 最近要做的东西,是对一个表格动态的添加行,删除行,并且对表格中内容进行非空验证. <!DOCTYPE html> <h ...

  9. jquery动态改变元素内容

    ● text() - 设置或返回所选元素的文本内容 ● html() - 设置或返回所选元素的内容(包括 HTML 标记) ● val() - 设置或返回表单字段的值(只针对表单或者输入框)

随机推荐

  1. Home界面的启动

    继上篇文章Launcher进程的启动,我们继续分析Home界面的启动. public final class ActivityThread { ...... public static final v ...

  2. 【u006】海战

    Time Limit: 1 second Memory Limit: 128 MB [问题描述] 在峰会期间,武装部队得处于高度戒备.警察将监视每一条大街,军队将保卫建筑物,领空将布满了F-2003飞 ...

  3. Cocos2d-x V3.2+Cocos Studio1.6 实现一个简单的uibutton点击功能

    好久没写博客了 这几天在学习cocos studio,这个软件可以很方便的设计游戏的一些界面,并导入到cocos2dx中,今天就用button来做个样例 首先我们打开Cocos Studio1.6,选 ...

  4. 机器学习: TensorFlow 的数据读取与TFRecords 格式

    最近学习tensorflow,发现其读取数据的方式看起来有些不同,所以又重新系统地看了一下文档,总得来说,tensorflow 有三种主流的数据读取方式: 1) 传送 (feeding): Pytho ...

  5. java读取.properties文件乱码

    1.config.properties文件写不进中文,写进去都变成了unicode,解决的方法是右键该文件--Properties--Resource--Text file encoding ,选ot ...

  6. SystemServer概述

    SystemServer由Zygote fork生成的,进程名为system_server,该进程承载着framework的核心服务. 调用流程如下: 上图前4步骤(即颜色为紫色的流程)运行在是Zyg ...

  7. Swift下CoreData的使用

    我之前的随笔中有写过一些iOS持久化存储的方法,包含了sqlite.解归档.沙盒存放等等.这些方式中,能够大规模存储,并保持性能的只有使用sqlite了.而这里将记录下Cocoa自身继承的数据库的存储 ...

  8. zxl2431 指向函数的指针

    (一) 用函数指针变量调用函数 可以用指针变量指向整形变量.字符串.数组.结构体.也可以指向一个函数.一个函数在编译时被分配一个入口地址.这个入口地址就称为函数指针.可以用一个指针变量指向函数,然后通 ...

  9. vue项目 下载表格 java后台返回的是信息流表格如何下载解决乱码

    主要是在请求参数后面加上{responseType: 'blob'}或者arrayBuffer this.$http.get(this.api.export, { params: this.info, ...

  10. 【cocos2dx 加载资源目录】

    从互联网下载vsproject代码.编译一切都还好吗,当发现向导的最后一个执行create没有找到图片功能异常.看图片Resource的内容下表,他没有排除的图像的可能性. 那么之后呢?!仅仅能是pr ...