<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>无标题文档</title>

<style type="text/css">

    #div1 {width: 200px;height: 200px;border: 1px solid black;}

</style>

</head>

<body>

<input id="txt1" type="text">

<input id="put1" type="button" value="改文字" />

<br/><br/>

<div id="div1"></div>

<script>

    var otxt=document.getElementById('txt1');

    var oput=document.getElementById('put1');

    var odiv=document.getElementById('div1');

    oput.onclick=function()

    {

        odiv.innerHTML=otxt.value;/*innerHTML里面就是正常的HTML，可以放上p、h1等*/

    }

</script>

</body>

</html>

innerHTML的用法的更多相关文章

  1. innerText和innerHTML， outerHTML

    js中 innerHTML与innerText的用法与区别及解决Firefox不支持Js的InnerHtml问题 用法: <div id="test"> <spa ...

  2. innerHTML和createTextNode的区别

    innerHTML的用法 tablerowObject.innerHTML createTextNode的用法 createTextNode(data) 返回新创建的 Text 节点,表示指定的 da ...

  3. DOM树操作

    DOM 操作 访问与树关系(节点) 绘制 DOM 树: childNodes, attributes 从一个中心元素访问其所有的直系亲属元素 访问父节点: parentNode 访问上一个兄弟节点: ...

  4. js_面向对象编程

    主要内容 值类型与引用类型的特征 深拷贝与浅拷贝 对象的动态特性 构造函数的执行过程 异常处理 dom操作(略) <!DOCTYPE html> <html> <head ...

  5. 混淆篇之原生DOM操作方法小结

    1.0   DOM结构 1.1先来看结构图: 父节点        兄弟节点        当前节点            属性节点            子节点        兄弟节点一般任意一个节 ...

  6. JS代码静态分析及挖掘

    JavaScript 已经成为现代 Web 浏览器开发中最普遍的技术之一.使用客户端 JavaScript 框架(如 AngularJS,ReactJS 和 Vue.js)构建的应用程序已向前端输送了 ...

  7. 【JavaScript】innerHTML、innerText和outerHTML的用法区别

    用法: <div id="test">   <span style="color:red">test1</span> tes ...

  8. js中innerHTML与innerText的用法与区别

    用法: <div id="test">    <span style="color:red">test1</span> te ...

  9. js中innerHTML、outerHTML与innerText的用法与区别

    ____________________________________________________________________________________________________ ...

随机推荐

  1. mac 上执行 rm -rf /

    # 很可怕的指令,清空磁盘所有资料,千万不要用 sudo 尝试,吓的小心肝差掉跳出来 rm -rf / 无聊,想执行rm -rf /会怎样,想起没加sudo时对~/download执行提示权限不足,被 ...

  2. 【转】虚拟化（二）：虚拟化及vmware workstation产品使用

    vmware workstation的最新版本是10.0.2.相信大家也都使用过,其中的简单的虚拟机的创建,删除等,都很简单,这里就不再详细说明了,下面我将简单介绍下vmware workstatio ...

  3. Java 8 函数接口详细教程

    ay = new byte[array.length]; for (int i = 0; i < array.length; i++) { transformedArray[i] = funct ...

  4. BZOJ 3510: 首都 LCT + multiset维护子树信息 + 树的重心

    Code: #include<bits/stdc++.h> #define maxn 200000 #define inf 1000000000 using namespace std; ...

  5. BZOJ 1827: [Usaco2010 Mar]gather 奶牛大集会 树形DP + 带权重心

    Description Bessie正在计划一年一度的奶牛大集会,来自全国各地的奶牛将来参加这一次集会.当然,她会选择最方便的地点来举办这次集会.每个奶牛居住在 N(1<=N<=100,0 ...

  6. RBM（受限玻尔兹曼机）和深层信念网络（Deep Brief Network）

    目录: 一.RBM 二.Deep Brief Network 三.Deep Autoencoder 一.RBM 1.定义[无监督学习] RBM记住三个要诀:1)两层结构图,可视层和隐藏层:[没输出层] ...

  7. [luogu4161 SCOI2009]游戏 (DP)

    传送门 Solution 可以发现实际上是把n分为几个循环节,然后找循环节的\(lcm\)是这次的排数 而\(lcm\)必然是一些最高次幂的质数的成积,那么就dp求一下所有情况就好了 PS:注意并不是 ...

  8. case...when...then if 用法

    select case when if 的一些用法 概述:sql语句中的case语句与高级语言中的switch语句,是标准sql的语法,适用于一个条件判断有多种值的情况下分别执行不同的操作. 首先,让 ...

  9. java中的replaceAll方法注意事项

    replaceAll和replace方法参数是不同的,replace的两个参数都是代表字符串,replaceAll的第一个参数是正则表达式 replaceAll中需要注意的特殊字符: \ == \\\ ...

  10. 单例模式的理解【php】

    单例模式(Singleton Pattern):顾名思义,就是只有一个实例.作为对象的创建模式,单例模式确保某一个类只有一个实例,而且自行实例化并向整个系统提供这个实例. 为什么要使用单例模式 1.P ...