动态创建HTML内容

2023-05-16

document.write()方法

document.write方法可以方便快捷的把字符串插入到文档里。它最大的缺点是违背了”分离javascript“原则。即使把document.write语句挪到外部函数里,你也还是需要在HTML文档的<body>部分使用<script>标签才能调用哪个函数。

 

innerHTML属性

innerHTML属性可以用来读、写某给定元素里的HTML内容。

<div id="textidv">

<p>This is <em>my</em> content.</p>

</div>

<em>标签是斜体的意思.

标准化DOM就像是一把手术刀,innerHTML是一把劈材刀。

当需要把一大段HTML内容插入一个网页时,innerHTML属性更适用。它是一个读写方法,不仅可以用它来读出元素的HTML内容,还可以用它把HTML内容写入元素。

innerHTML属性要比document.write()方法更值得推荐。

 

DOM提供的方法

DOM是一个双向车道,不仅可以查询文档的内容,还可以刷新文档的内容。只要改变了DOM节点树,文档在浏览器里呈现效果就会发生变化。

 

createElement()方法

appendChild()方法

createTextNode方法 

      var testdiv = document.getElementById("testdiv");

  var para = document.createElement("p");

  testdiv.appendChild(para);

      var txt = document.createTextNode(”hello world!");

      para.appendChild(txt);

 

insertBefore()方法

    parentElement.insertBefore(newElement,targetElement

insertAfter()方法

    function insertAfter(newElement,targetElement){

         var parent = targetElement.parentNode;

         if(parent.lastChild == targetElement){

                  parent.appentChild(newELement); 

        

          else{

               parent.insertBefore(newElement,targetElement.nextSibling);

          }

   }

 

 

 

 

 

 

转载于:https://www.cnblogs.com/Eleanore/archive/2012/05/25/2518164.html

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

动态创建HTML内容 的相关文章

随机推荐

  • 面试题:你在项目中遇到哪些问题?

    你在项目中遇到哪些问题 xff1f 因为目前项目采用的是分布式 xff0c 分布式环境下一般采用集群方案 xff0c 所以这就会带来分布式的一些问题 xff0c 比如 xff1a 1 分布式锁 2 分布式session 3 分布式全局id
  • sql中插入带有单引号的数据

    字符串数据是用单引号包在外面的 xff0c 如果插入的数据中包含单引号 xff0c 就需要再做处理 可以将单引号替换成两个单引号 xff0c 在sql中连续两个单引号就表示一个单引号字符 举例如下 xff1a insert into A a
  • PHP日期与时间戳转换

    设置时区 在php ini中找到data timezone去掉它前面的 号 然后设置data timezone 61 34 Asia Shanghai 34 或者 ini set 39 date timezone 39 39 Asia Sh
  • hashheap python 实现

    class Node object 34 34 34 the type of class stored in the hashmap in case there are many same heights in the heap maint
  • Cocos Creator 实现大厅+子游戏模式

    大厅 43 子游戏的模式 xff0c 在棋牌类型 教育类型游戏中比较常见 xff0c 通常是安装包里面只有大厅的资源和代码 xff0c 然后子游戏根据需求以热更新的方式下载来提供给玩家 之前一直负责的是cocos2dx lua的开发 xff
  • matlab练习程序(Kruskal最小生成树)

    老物了 xff0c 网上的例子多的数不过来 不过我还是有必要练习一下的 之所以看这个算法是因为最近在看颜色聚合向量时 xff0c 有的论文用到了最小生成树 xff0c 因此我就拿来熟悉一下 Kruskal算法类似于连通分支算法 xff0c
  • LDMIA、LDMIB、LDMDB、LDMDA、STMIA、LDMFD、LDMFA、LDMED、LDMEA指令详解

    简介 ARM指令中多数据传输共有两种 LDM load much 多数据加载 将地址上的值加载到寄存器上 STM store much 多数据存储 将寄存器的值存到地址上 主要用途 xff1a 现场保护 数据复制 参数传送等 xff0c 共
  • 为什么很多开发游戏的程序员选择半路转行?

    作为一个在软件行业混迹了十几年的老码农 xff0c 只能讲不仅仅是游戏行业程序员在深坑里 xff0c 国内很多程序员都在坑里呆着那 xff0c 特别是战斗在互联网公司的程序员兄弟们 xff0c 几乎天天都是加班加点的日子 xff0c 整体来
  • 仅仅有走过的路 才懂她的内容

    年少初遇常在我心 傻傻的站在十一教门前一排高高的杨树下伫立 xff0c 独念风凉 叶落肩头 我该用什么去聆听这走过的两个月 明年的枝头 xff0c 依然会看到今日的灿烂 想想磕磕绊绊的两个月 xff0c 学习的故事轮番上演 一个比一个精彩
  • 关于 来源: volmgr Event ID: 46 故障转储初始化未成功 的问题

    最近笔记本电脑硬件有点问题 xff0c 查看系统日记 xff0c 如下 xff1a volmgr Event ID 46 故障转储初始化未成功 最后找到了一个解决方案 xff1a 网上查了一下 volmgr 错误 故障转储初始化未成功的解决
  • Weka中数据挖掘与机器学习系列之Weka Package Manager安装所需WEKA的附加算法包出错问题解决方案总结(八)...

    不多说 xff0c 直接上干货 xff01 Weka中数据挖掘与机器学习系列之Weka系统安装 xff08 四 xff09 Weka中数据挖掘与机器学习系列之Weka3 7和3 9不同版本共存 xff08 七 xff09 情况1 对于在We
  • 数据恢复软件如何换机使用?

    作为好用的数据恢复软件 xff0c EasyRecovery易恢复可以用来恢复文件 文件夹 照片 视频等丢失的文件 xff0c 而且支持换机使用 xff0c 如果要换电脑的话 xff0c 记得一定要按以下步骤操作哦 xff01 EasyRe
  • SQL server修改字段名,属性

    修改字段名 exec sp rename 表名 列名 新列名 修改字段属性 alter table 表名 alter column 列名 nvarchar 100 null 修改默认值 alter table 表名 add constrai
  • 手把手教你启用Win10的Linux子系统(超详细)

    原文 手把手教你启用Win10的Linux子系统 xff08 超详细 xff09 版权声明 xff1a 转载请保留出处 xff0c 谢谢 xff01 https blog csdn net zhangdongren article deta
  • 不要再被骗了------QQ盗号原理大揭秘

    前言 相信大家在懵懂无知的时候都有被盗号的经历吧 xff0c QQ胡乱的加好友 xff0c 突然有个好友传了个文件给你 xff0c 打开以后发现QQ竟然显示强制下线 xff0c 然后再也上不去了QAQ xff0c 很明显 xff0c QQ号
  • 移动端唤起键盘时取消position:fixed定位

    当在移动端按钮position fixed 底部bottom 0 固定定位后 xff0c 当唤起键盘输入数据时就会出现很头疼的问题 xff1a 固定在底部的按钮会被系统自带的键盘挤上去 xff0c 占用输入框位置 xff1b 如图 xff1
  • nginx根据访问的url参数或者是请求 头部做判断转发

    在http请求后端时 xff0c token是一种非常常见的使用方式 xff0c 但是如果url请求参数不带token xff0c 或者请求头部不带token这样的请求应当直接返回401 xff0c 而不要代理给后端服务器做处理了 可以有效
  • java 获取HttpRequest Header 的几种方法 & 请求request的所有参数实现方法

    2019独角兽企业重金招聘Python工程师标准 gt gt gt 在开发应用程序的过程中 xff0c 如果有多个应用 xff0c 通常会通过一个portal 门户来集成 xff0c 这个portal 是所有应用程序的入口 xff0c 用户
  • CISCO路由器license激活图解教程

    此次也是一台CISCO 3945E K9路由器 xff0c 新设备启动后执行show version命令查看版本信息 xff1a 以下为show version中license信息 License Info License UDI Devi
  • 动态创建HTML内容

    document write xff08 xff09 方法 document write方法可以方便快捷的把字符串插入到文档里 它最大的缺点是违背了 分离javascript 原则 即使把document write语句挪到外部函数里 xf