<!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. spring实现helloWord

    第一步:添加架包 第二步:写一个简单的实列 package com.java.test; /** * @author nidegui * @create 2019-06-22 10:58 */ pub ...

  2. 【转】Linux rpm 命令参数使用详解［介绍和应用］

    RPM是RedHat Package Manager(RedHat软件包管理工具)类似Windows里面的“添加/删除程序” rpm 执行安装包二进制包(Binary)以及源代码包(Source)两种 ...

  3. Javaweb 使用Servlet技术改写用户登录 使用Filter技术解决中文乱码

    先把实验3的jsp页面复制过来: WebContent->WEB-INF->lib下面的jar包8.0版本也要记得复制: Java Resources->src下的 cn.edu.h ...

  4. 11.【Linq】

    11.2.4  Cast . OfType 和显式类型的范围变量 这两个操作符很相似:都可以处理任意非类型化的序列(它们是非泛型 IEnumerable 类的扩展方法),并返回强类型的序列. Cast ...

  5. VUE常见问题解决

    1.vue模板加载顺序 computed:例如分页的配置: created:dom加载前一般用来生成dom mounted:dom加载后用来覆盖渲染或者基于dom的操作 2.关于this指向的问题 通 ...

  6. case...when...then if 用法

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

  7. Linux运维工程师学习大纲

    linux运维课程大纲: Linux运维: Linux系统管理: Linux服务及安全管理: httpd,lamp,lnmp cache:memcached,varnish DB:mysql(mari ...

  8. 使用 AFNetworking的时候，怎样管理 session ID

    问: As the title implies, I am using AFNetworking in an iOS project in which the application talks to ...

  9. #leetcode#Anagrames

    Given an array of strings, return all groups of strings that are anagrams. Note: All inputs will be ...

  10. 关于PHP浮点数之 intval((0.1+0.7)*10) 为什么是7

    PHP是一种弱类型语言, 这样的特性, 必然要求有无缝透明的隐式类型转换, PHP内部使用zval来保存任意类型的数值, zval的结构如下(5.2为例): struct _zval_struct { ...