案例1 删除元素
如需删除 HTML 元素,需要清楚该元素的父元素
该js函数代码如下

function remove(){
var parent=document.getElementById("demo");
var child=document.getElementById("demo1");
parent.removeChild(child);
}

演示:隐藏例1

案例2 追加元素
代码实例:

function append(){
var para=document.createElement("p");
var node=document.createTextNode("in the world.");
para.appendChild(node);
var element=document.getElementById("demo2");
element.appendChild(para);
}

演示:追加element

Across the Great Wall,

we can reach every conner

需要注意的是这些事件应该只执行一次,可以在函数外面加一个布尔变量声明为true,在函数
里面使用if语句,然后将布尔变量改变为false,这样就可以让onclick事件只执行一次了。

参考资料:w3cschool

JavaScript修改元素的更多相关文章

  1. Selenium调用JavaScript修改元素属性

    修改元素的style,主要是将一些隐性元素显示出来,让元素可被操作: JavascriptExecutor  js = (JavascriptExecutor)driver; js.executeSc ...

  2. JavaScript 修改元素值

    document.getElementById('yybz').value=jsdata.toLocaleString(); document.getElementById('yybz').inner ...

  3. JavaScript 读取修改元素 及 伸拉门案例

    JavaScript 读取修改元素 及 伸拉门案例 版权声明:未经授权,严禁转载! 读取 / 修改元素 - 读取修改元素内容 - 读取修改元素属性 - 读取修改元素样式 元素的内容 读取或修改元素节点 ...

  4. JavaScript--DOM修改元素的属性

    一旦你获得了要修改的元素,可以有2种方式,来读取和修改它的属性:一种老的方式(它被更多的用户代理所支持)和一种新的DOM方法的方式.老的和新的用户代理都允许你以对象属性的方式获取和设置元素的属性. 先 ...

  5. JavaScript修改Canvas图片

    用JavaScript修改Canvas图片的分辨率(DPI)   应用场景: 仓库每次发货需要打印标签, Canvas根据从数据库读取的产品信息可以生成标签JPG, 但是这个JPG图片的默认分辨率(D ...

  6. JavaScript DOM 元素属性 状态属性

    JavaScript DOM 元素属性 状态属性 版权声明:未经允许,严禁转载! 元素的属性 核心 DOM 为我们提供了操作元素标准属性的统一 API. 所有属性节点都储存在元素的 attribute ...

  7. javascript修改html <b>标签里面的内容

    简单实现仅供参考: javascript修改html <b>标签里面的化妆步骤内容<体><b style=“width:100px:height:100px:border ...

  8. Dom修改元素样式

    提纲:我们可以通过js来修改元素的大小,颜色,位置等样式 1.element.style                         行内样式的操作 2.element.className    ...

  9. JavaScript通过元素id和name直接获取元素的方法

    概览: 偶然的机会,我在JavaScript中直接用HTML元素的id属性来获取该元素,并设置该元素的其他属性值,竟然能够正确解析不报错!于是我去查阅相关资料,也有其他同行这么用. 虽然说这种用法不是 ...

随机推荐

  1. ROC曲线,AUC面积

    AUC(Area under Curve):Roc曲线下的面积,介于0.1和1之间.Auc作为数值可以直观的评价分类器的好坏,值越大越好. 首先AUC值是一个概率值,当你随机挑选一个正样本以及负样本, ...

  2. php 编译安装 mysql.so

    编译mysql.so # 进入php-5.2.14源码目录 cd /usr/local/src/php- # 进入 mysql ext 的源码目录 cd ext/mysql # 构建编译配置, 假设p ...

  3. Cocos Creator 对象池cc.NodePool的使用

    对象池cc.NodePool把层级管理器中的节点拖进资源管理器中就创建了预制体:let和var 一样,是声明变量的关键词, 同一个变量名时,var 即使在{}内也作用全局,let有范围:(1)将需要数 ...

  4. mac系统搭建SVN版本控制

    版权声明:本文为博主原创文章,未经博主允许不得转载. SmartSVN 8.6和Keygen for mac(完美破解)http://pan.baidu.com/s/1bnm72qz 一.里面包含Sm ...

  5. 开源unittest测试报告源码BSTestRunner.py

    开源BSTestRunner 生成HTML测试报告源码: 保存代码到BSTestRunner.py 配合Unittest使用,很完美. python2: """ A Te ...

  6. node.js初识02

    node.js相较于那些老的服务器语言,他的优势在于,节省了I/O的时间,主要的特点是单线程,非阻塞和事件驱动,其实三个说的是同一个事情,相较于多线程而言,单线程的特点是,使用的那一条线程的cpu的利 ...

  7. django后台的制作

    参考:http://zengestudy.blog.51cto.com/1702365/1902660 http://www.cnblogs.com/fnng/p/3737964.html 实现与后台 ...

  8. 阿里云ECS服务器 常见问题(1)

    无法在外网访问服务器的公网ip 解决方法: 在阿里云 云服务器ECS-安全组规则 添加端口 可更根据阿里的教程来 配置完成后即可访问!

  9. 添加Google搜索

    给自己的网站加一个搜索功能很简单,代码如下: 欢迎访问我的博客:http://67566894.iteye.com/ <form action="http://www.google.c ...

  10. html5-css的引入

    <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8&qu ...