1.1 创建 DOM 元素以及相应的追加方式

  1.1.1  创建:document.createElement('div'); 添加: fatherEle.appendChild(ele);

  

  appendChild 是将一个元素追加到另一个元素的最后, 不会覆盖父元素原有的内容。

  1.1.2  拼接元素的字符串,利用父元素的innerHTML设置父元素的内容

   父元素中的html内容为html字符串,回复该父元素原有的内容。

    这种方法直接清空父元素中所有的元素。

  1.1.3 insertBefore

  

  此外还有document.write,但是此方法会覆盖页面所有的内容。(不建议使用)

    

1.2 删除dom元素

  1.2.1 删除父元素下某个子元素:document.getElementById('fatherBox').removeChild(pEle[0]);

    

  此处可以直接使用子元素的parentNode 去删除该子元素 ,如

   

  1.2.2 清空父元素下所有的内容, innerHTML = '';

    

1.3 修改dom元素的属性

    1.3.1  attributes获取一个元素作为对象

    

    

    1.3.2  getAttribute 和 setAttribute

    

    1.3.3 createAttribute

    

JS DOM元素的操作(创建,添加,删除,和修改属性)的更多相关文章

  1. dir(dict)|字典的创建-添加-删除-修改-判断存在-取值等相关操作

    dir(dict) ####字典操作:创建-添加-删除-修改-判断存在-取值 #(一)创建字典: {} .等号. zip(). [(),()] #1.创建空字典 dict0 = {} #2.等号创建 ...

  2. Ajax基础(四)--dom元素简单操作

    1 //js对dom元素的操作 //添加dom元素 var param = document.createElement("p"); var node = document.cre ...

  3. hbase笔记---新版api之对表的操作,指定region创建,普通创建,删除,修改列族信息

    hbase 对于表的相关操作: 实现功能有:指定region创建,普通创建,删除,修改列族信息 package learm.forclass.testclass; import org.apache. ...

  4. js节点的创建添加删除

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

  5. JS中对DOM元素的操作

    https://www.runoob.com/jquery/jquery-ref-html.html 1.each  遍历 //遍历所有class为checksingle的DOM元素 $(" ...

  6. Dom元素的操作

    getElementById(): 获取有指定惟一ID属性值文档中的元素 getElementsByName(name): 返回的是数组 getElementsByTagName(): 返回具有指定标 ...

  7. 获取 js DOM元素中绑定的所有事件,模仿 chrome getEventListeners

    偶尔看到了这个问题,如何用JS获取元素某一事件上绑定的所有Listener? 突然觉得好像是有解决办法的,查了下,在 chrome 下,支持 window.getEventListeners(obj) ...

  8. SQL语句处理一些修改、新增、删除、修改属性操作(MySql)

    方法一: 直接(手动)去修改数据库名称,数据库表名称,数据库列名称.列属性 方法二: 使用SQL语句去修改 -- 修改表名 ALTER TABLE tableName RENAME newTableN ...

  9. JQ DOM元素 创建 添加 删除

    创建元素 // 创建元素节点 $('<p></p>'); // 创建属性节点 $('<p class="wow"></p>'); / ...

随机推荐

  1. 漫漫人生路,我们该何去何从! Python让我找到了方向

    互联网寒冬 2017年冬天,是我人生中最难熬的一个冬天,其实2017年的冬天并不算太冷,比这冬日的寒风还要严寒的要属这所谓的"互联网寒冬"吧!各大厂裁员的消息充斥着互联网,互联网表 ...

  2. Python中map和reduce函数??

    ①从参数方面来讲: map()函数: map()包含两个参数,第一个是参数是一个函数,第二个是序列(列表或元组).其中,函数(即map的第一个参数位置的函数)可以接收一个或多个参数. reduce() ...

  3. js中reduce()的牛掰所在 本质作用:实现数值累计,筛选过滤,类似递归

      先看w3c官说   array.reduce(function(total, currentValue, currentIndex, arr), initialValue); /* total: ...

  4. MongoDB的使用学习之(二)简介

    原文链接:http://www.cnblogs.com/yxlblogs/p/3681089.html MongoDB 是一个高性能,开源,无模式的文档型数据库,是当前 NoSQL 数据库产品中最热门 ...

  5. 从excel表中生成批量SQL

    excel表格中有许多数据,需要将数据导入数据库中,又不能一个一个手工录入,可以生成SQL,来批量操作.   ="insert into Log_loginUser (LogID, Logi ...

  6. DbArithmeticExpression arguments must have a numeric common type.

    引用 system.data.linq

  7. Cocos2d-x视频教程

    目录 1. 我的技术专栏 2. 相关推荐 3. 下载链接 4. cocos2d-xx Lua+JS+C++教学视频 5. 杨丰盛Cocos2D-X游戏课程 6. [Cocos2d-x]塔防游戏开发实战 ...

  8. Linux性能优化从入门到实战:13 内存篇:内存指标/工具总结、问题定位和调优

    内存性能指标 系统内存指标 已用内存和剩余内存很容易理解,就是已经使用和还未使用的内存. 共享内存是通过 tmpfs 实现的,所以它的大小也就是 tmpfs 使用的内存大小.tmpfs 其实也是一种特 ...

  9. HDU 4678 Mine(博弈)

    Mine Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65535/32768 K (Java/Others) Total Submi ...

  10. VPS Linux修改root密码

    hosteons VPS 没有提供在网页控制面板里修改root密码的选项,但是可以通过Rescue模式吃查看root密码以及 有重置root密码为随机值的选项. 在重置root密码为随机值后,进入系统 ...