这几天用zepto.js写了不少事件，突然想到一个问题，那就是原生的js如何给动态生成的标签添加事件？因为这些标签都是后来通过ajax或者运行其他点击事件生成的，那么如果之前给他们写事件他们这个dom对象是找不到的，jq通过事件委托解决了这个问题，但是原生js这个问题该怎么解决呢？我在网上查了很多资料，好像只有一种办法，那就是在生成标签并把标签添加到html结构中后再添加对于这个新标签的各种事件，如果有更好的方法，欢迎提出来。

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

</head>

<body>

    <div id="a">我是初始就有的div </div>

</body>

<script type="text/javascript">

window.onload = function () {

    var myp = document.createElement('p');

    document.getElementById('a').appendChild(myp);

    alert(document.getElementsByTagName('p')[])

    myp.innerHTML = '我是新建的p标签';

document.getElementsByTagName('p')[].onclick = function(){

        alert('我是p的点击事件')

    }

}

</script>

</html>

原生js怎么为动态生成的标签添加各种事件的更多相关文章

  1. jquery中对动态生成的标签响应click事件（二）…与ajax交互使用

    <%@ page language="java" contentType="text/html; charset=GB18030" pageEncodin ...

  2. jquery中对动态生成的标签响应click事件（一）

    参考自:http://my.oschina.net/lishixi/blog/31612 <%@ page language="java" contentType=" ...

  3. iOS中动态注入JavaScript方法。动态给html标签添加事件

    项目中有这样一种需求,给html5网页中图片添加点击事件,并且弹出弹出点击的对应的图片,并且可以保持图片到本地 应对这样的需求你可能会想到很多方法来实现. 1. 最简单的方法就是在html5中添加图片 ...

  4. jq给动态生成的标签绑定事件的几种方法

    经常遇到给动态生成的标签绑定事件不好用,自己简单测试总结了下,结论如下了: body> <!-- 下面是用纯动态方式生成标签 --> <div id="d2" ...

  5. 动态生成li标签，并设置点击事件

    今天要解释的是如下界面              主要实现了: 1.模拟后台的json数据,动态生成li标签 2.导航栏的下划线 3.给li标签右边设置图片 4.动态生成的li标签,设置选中的li的点 ...

  6. js如何实现动态在表格中添加标题和去掉标题？

    js如何实现动态在表格中添加标题和去掉标题? 一.总结 1.通过table标签的createCaption(),deleteCaption()方法实现. document.getElementById ...

  7. jquery无法为动态生成的元素添加点击事件的解决方法

    遇到 jquery无法为动态生成的元素添加点击事件,谷歌一下,整理一下解决方法如下: (<li>中间的元素是动态生成的), 现在想为<i>添加点击事件, 例子如下: <d ...

  8. a 标签添加 onclick 事件

    a 标签添加 onclick 事件 <a href="javascript:void(0);" οnclick="js_method()">点击&l ...

  9. jquery动态生成的元素添加事件的方法

    动态生成的元素如果要添加事件,要写成 $(document).on("click", "#txtName", function() { alert(this.v ...

随机推荐

  1. Fixjs实践——标签、按钮控件

    Fixjs介绍 Fixjs是一款javascript界面基础框架,主要为开发复杂组件提供底层的框架支持. Fixjs 0.3.0主要增加了文本显示类fixjs.text.TextField 支持的主要 ...

  2. CentOS 安装 Mogodb（在线 && 离线）

    平台之大势何人能挡? 带着你的Net飞奔吧!http://www.cnblogs.com/dunitian/p/4822808.html 先说推荐安装:在线安装,跟着官方走可以避免一些问题 新学Mon ...

  3. 使用纯css代码实现div的“回”字型“叠放”效果

    正如大家所知道的那样,div是一个块级元素,也是网页编写过程中使用频率最高的一个元素,通过不同的样式控制可以实现一些最常见的页面效果,当然也可以实现一些比较复杂的页面效果,这里就展示一个本人面试过程中 ...

  4. C语言之scarf函数

    一 基本用法 scanf函数:接收用户的输入 语法: scanf("格式化控制符",地址列表); 例: int num; scanf("%d",&num ...

  5. 为什么用Object.prototype.toString.call(obj)检测对象类型?

    最近做了做一些js面试25 Essential JavaScript Interview Questions*,其中第一道是:使用typeof bar === "object"检测 ...

  6. SqlDataReader中的GetSqlValue（）方法

    sdr.GetValue(0) "Title"sdr.GetValue(1)4sdr.GetValue(2)falsesdr.GetValue(3)0sdr.GetValue(4) ...

  7. centos jdk 安装

    1)下载JDK 1.7(1.7.0_25) 下载地址为: http://www.Oracle.com/technetwork/java/javase/downloads/jdk7-downloads- ...

  8. git 查看某个文件的历史修改版本

    [git status 查看修改的文件路径] git log --follow -p routes/admin/contract_operation.js

  9. SSH 一些错误的解决办法

    1.主动访问的机器需要创建私钥和公钥 (client) #cd ~#mkdir .ssh#chmod 700 .ssh#cd .ssh#ssh-keygen -t rsa //一路回车,各种提示按默认 ...

  10. HDU 1728 逃离迷宫(DFS||BFS)

    逃离迷宫 Problem Description 给定一个m × n (m行, n列)的迷宫,迷宫中有两个位置,gloria想从迷宫的一个位置走到另外一个位置,当然迷宫中有些地方是空地,gloria可 ...