jquery动态添加节点

<1>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="http://localhost:41928/Jquery/jquery-1.10.2.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            var link = $("<a href='http://www.baidu.com'>百度</a>"); //创建一个节点
            $("div:first").append(link); //将link节点添加到第一个div中
            var link = $("<a href='http://www.google.com.hk'>谷歌</a>"); //重新创建一个节点
            $("div:last").append(link); //将link节点添加到最后一个div中
        })
        //======================================================================================

        //定义一个字典风格的数组
        var data = { "百度": "http://www.baidu.com", "新浪": "http://www.sina.com.cn", "搜狐": "http://www.sohu.com" };
        $(function () {
            $.each(data, function (key, value) {  //遍历这个数组,调用匿名函数进行处理
                var link = $("<tr><td><a href=" + value + ">" + key + "</a></td></tr>"); //创建一个节点
                $("#table1").append(link); //将这个节点加入到table中
            })
        })

    </script>
</head>
<body>
<div></div>
<div></div>

<table id="table1"></table>
</body>
</html>

jquery动态添加节点

时间: 2024-11-08 19:21:51

jquery动态添加节点的相关文章

Jquery 动态添加删除元素 用js添加的元素无法删除问题

用jquery方法的绑定侦听和销毁来解决动态div的增加删除: 正确代码: <script type="text/javascript" > $(document).ready(function(){  bindListener(); }) function addimg(){  $("#mdiv").append('<div ><input type="file" name="img[]" /&

jQuery动态添加input type=file文件上传域

jQuery动态添加input type=file文件上传域,当用户需要通过网页上传多个文件的时候,动态添加文件域就显得尤其重要,本功能引入了jQuery,兼容性方面也做的不错,暂时没有限制文件域的个数,所以你可以无限制的生成文件域,直到满足你的需要. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transit

jquery动态添加删除div--事件绑定,对象克隆

我想做一个可以动态添加删除div的功能.中间遇到一个问题,最后在phpchina问答区版主的热心帮助下解答了(答案在最后)        使用到的jquery方法和思想就是:事件的绑定和销毁(unbind),另外还可以使用clone,通过克隆可以很好的解决这个问题          相关描述如下 功能:点击增加,自动添加一个iptdiv 点击 iptdiv后的 X 自动删除当前div 问题:默认存在的(也就是页面加载进来的)的那个iptdiv 后的 X 点击有效,可以删除当前 iptdiv  但

jquey学习2之jquery动态添加页面片段

第一个方法:append()方法 [1]$(selector).append(content)//向匹配的所有标签中的内容末尾处添加Html代码,会编译成页面显示. 1 <html> 2 <head> 3 <script type="text/javascript" src="/jquery/jquery.js"></script> 4 <script type="text/javascript&quo

jquery动态添加删除一行数据

<html> <head> <title>添加.删除一行</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <script type="text/javascript" src="../js/jquery-1.9.1.js"></script>

给Jquery动态添加的元素添加事件

给Jquery动态添加的元素添加事件 我想很多人都会向我一样曾经 被新元素的事件绑定困惑很久也就是在页面加载完成后给元素绑定了事件,但又新增加的元素上却没有绑定任何事件. js的事件监听跟css不一样,css只要设定好了样式,不论是原来就有的还是新添加的,都有一样的表现.而事件监听不是,你必须给每一个元素单独绑定事件. 常见的例子是处理表格的时候.每行行末有个删除按钮,点了这个能够删除这一行. <table>    <tbody>        <tr>        

jQuery动态添加的元素绑定事件处理函数代码

jQuery动态添加的元素绑定事件处理函数代码 作者: 字体:[增加 减小] 类型:转载 有一段时间没用jquery了,今天又碰到这个问题.当时是知道有livejquery可以解决.但是我并不喜欢为了这个而另外加载一个. 我当时的处理方法是在添加的时候手工绑定事件处理函数.不过新版的jquery已经添加了这个功能.我们已经不需要为此烦恼了. 参考:http://api.jquery.com/live/ 以前我们定义事件,比如为元素定义单击事件是这样写的: 复制代码 代码如下: $('input'

jquery学习记录一:jquery动态添加html元素后设置其绑定事件

1. jquery动态添加html元素(例如:) <div id="testdiv"> <ul></ul> </div> 假设我们要给ul动态添加的<li>绑定click事件形成如下结果 <div id="devices_div"> <ul> <li name="apple">apple</li> <li name="pea

[转载]给Jquery动态添加的元素添加事件

原文地址:给Jquery动态添加的元素添加事件作者:小飞侠 我想很多人都会向我一样曾经 被新元素的事件绑定困惑很久也就是在页面加载完成后给元素绑定了事件,但又新增加的元素上却没有绑定任何事件. js的事件监听跟css不一样,css只要设定好了样式,不论是原来就有的还是新添加的,都有一样的表现.而事件监听不是,你必须给每一个元素单独绑定事件. 常见的例子是处理表格的时候.每行行末有个删除按钮,点了这个能够删除这一行. <table> <tbody> <tr> <td