1. <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>Title</title>
    </head>
    <body>
    <div id="div1">
  2.  
  3. </div>
    <input value="加张图片" id="img" type="button">
    <script>
    var img=document.getElementById("img"); // 先导航到INPUT标签
    img.onclick=function () { // 给他绑定onclick事件
    var ele=document.getElementById("div1"); // 找到要操作的标签 div1
    var add=document.createElement("img"); // 创建一个IMG的标签
  4.  
  5. add.src="timg.jpg"; // 给他添加src属性 链接到文件名(这个是动态HTML写法 微软改的)
  1.   //add.setAttribute("img","timg,jpg"); // 这是第2种添加方法
  1. ele.appendChild(add); // 给div1加入 IMG标签
  2.  
  3. }
    </script>
    </body>
    </html>

js 添加HTML属性的方法的更多相关文章

  1. python装饰器、继承、元类、mixin,四种給类动态添加类属性和方法的方式(一)

    介绍装饰器.继承.元类.mixin,四种給类动态添加类属性和方法的方式 有时候需要給类添加额外的东西,有些东西很频繁,每个类都需要,如果不想反复的复制粘贴到每个类,可以动态添加. # coding=u ...

  2. js函数的属性和方法

    js函数的属性和方法 前面的话 函数是javascript中特殊的对象,可以拥有属性和方法,就像普通的对象拥有属性和方法一样.甚至可以用Function()构造函数来创建新的函数对象.本文是深入理解j ...

  3. 转载:js 创建对象、属性、方法

    1,自定义对象. 根据JS的对象扩展机制,用户可以自定义JS对象,这与Java语言有类似的地方. 与自定义对象相对应的是JS标准对象,例如Date.Array.Math等等. 2,原型(prototy ...

  4. JS获取对象“属性”的方法

    var testObj= new Object(); testObj.name = "shangguan"; testObj.age= ; testObj.action = fun ...

  5. JS枚举对象属性的方法及其区别

    愉快的中秋节要过去了,国庆倒计时两个周!!! 闲话不多说,那今天我们来看一看JS中枚举对象属性的方法有哪些以及他们的区别 首先在JS里面枚举对象属性一共有三种方法 for in: 会遍历对象中所有的可 ...

  6. 在 JavaScript 中,我们能为原始类型添加一个属性或方法吗?

    原始类型的方法 JavaScript 允许我们像使用对象一样使用原始类型(字符串,数字等).JavaScript 还提供了这样的调用方法.我们很快就会学习它们,但是首先我们将了解它的工作原理,毕竟原始 ...

  7. js object 对象 属性和方法的使用

    //object 对象 属性和方法的使用 var person = new Object(); person.name="张海"; person.age="; perso ...

  8. JS获取对象“属性和方法”的方法

    平时在写的代码过程中,经常会遇到对对象Object的数据处理.而在对对象的数据处理中,操作最频繁的是“数据引用”.“值的修改”.“获取关键字(属性)”.平时最烦的也是“获取关键字”,经常忘记怎么去获取 ...

  9. JS的Document属性和方法

    Attributes 存储节点的属性列表(只读)childNodes 存储节点的子节点列表(只读)dataType 返回此节点的数据类型Definition 以DTD或XML模式给出的节点的定义(只读 ...

随机推荐

  1. opencv.js小案例

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  2. oracle闪回存储过程

    源地址:https://www.baidu.com/link?url=qgVCi_BLGOYqxJN0Fqqt-9N0SmCwtGI70SIh-TFpx1nP6oaVoMj8H6yjEqilto6TM ...

  3. Python实现KNN算法

    Python实现Knn算法 关键词:KNN.K-近邻(KNN)算法.欧氏距离.曼哈顿距离  KNN是通过测量不同特征值之间的距离进行分类.它的的思路是:如果一个样本在特征空间中的k个最相似(即特征空间 ...

  4. ubuntu 上的python不能解析jpeg,png?

    在安装pillow之前需要先安装以下支持包1.apt-get install libjpeg-dev libfreetype6-dev zlib1g-dev libpng12-dev2.安装pillo ...

  5. GCD - Extreme (II) UVA - 11426 数学

    Given the value of N , you will have to nd the value of G . The de nition of G is given below: G = i ...

  6. SpeechVoiceSpeakFlags枚举类型的详细解释

    http://blog.csdn.net/zhou_xw6511/article/details/8313528

  7. SLAM技术在国内的发展现状

    近年来,由于扫地机的出现使得SLAM技术名声大噪,如今,已在机器人.无人机.AVG等领域相继出现它的身影,今天就来跟大家聊一聊国内SLAM的发展现状. SLAM的多领域应用 SLAM应用领域广泛,按其 ...

  8. mysql 彻底解决:Incorrect string value: '\xF0\x9F\x98\xAD",...' for column 'commentContent' at row 1

    彻底解决:Incorrect string value: '\xF0\x9F\x98\xAD",...' for column 'commentContent' at row 1 今天在爬取 ...

  9. 013 Android ActionFloatingButton悬浮按钮组件与Snackbar组件使用

    1.导入ActionFloatingButton组件(点击下载按钮,安装组件) 2,.ImageView图片XML设置 <ImageView android:id="@+id/imag ...

  10. BZOJ3065 带插入区间K小值 || 洛谷P4278

    这是一道让我崩溃的题...... 然鹅洛谷上时限被改然后只有20分......好像所有人都被卡了(雾) 由于替罪羊树不是依靠旋转操作而是依靠暴力重构的方式维护树的平衡,所以我们可以考虑使用替罪羊树套区 ...