永远不知道你可以改变的内容,一个HTML元素?也许你要取代的文字段落中,以反映什么访客选定刚刚从下拉框中。通过操纵一个元素的innerHtml您可以变更您的文本和HTML多达你喜欢。
改变文字innerHTML
每个HTML元素具有InnerHtml属性定义的HTML代码和文字之间发生的元素的开幕式和闭幕式标记。通过改变一个元素的innerHTML后,一些用户交互,您可以更互动网页。
但是,使用innerHTML需要一些准备,如果你希望能够利用它轻松,可靠。首先,你必须给予部分要更改身份证。与标识到位,你将能够使用getElementById功能,适用于所有的浏览器。
在您认为建立您现在就可以操纵文字的要素。要开始了,让我们尝试改变文字一个大胆的标记。
下面我们来看一个用js的innerHTML来改变div值吧.

<script type="text/javascript">
//改变innerHtml
//来源:www.jbxue.com
function changeText(){
document.getElementById('boldStuff').innerHTML = 'Fred Flinstone';
}
</script>
<p>Welcome to the site <b id='boldStuff'>dude</b> </p>
<input type='button' onclick='changeText()' value='Change Text'/>

js innerHTML 改变div内容的方法的更多相关文章

  1. JS/javaScript 获取div内容

    jquery: 例如<div id="abc"><a>内容</a></div>$("#abc").html(); ...

  2. js修改剪切板内容的方法

    代码如下: //绑定在了body上,也可以绑定在其他可用元素行,但是不是所有元素都支持copy事件. $(document.body).bind({ copy: function(e) {//copy ...

  3. js怎样改变div的宽度

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. js实现选中div内容并复制到剪切板

    function copyUrl () { var div = document.getElementById('xxxx'); if (document.body.createTextRange) ...

  5. 【onclick事件】【改变 HTML 内容innerHTML】【图片替换】【改变标签的css】【判断输入是否是数字】

    1.onclick事件 <button type="button" onclick="alert('Welcome!')">点击这里</but ...

  6. JS获取div高度的方法

    有时在写页面时,需要获取一个div的高度.怎么才能获取呢?哈哈,先上结论.有两种方法. offsetHeight .clientHeight getComputedStyle offsetHeight ...

  7. DOM操作 、js获取id的内容 和修改原来的内容(innerHTML)

    js获取id的内容(getElementById) 和修改原来的内容(innerHTML) 1.通过ID获取元素 学过HTML/CSS样式,都知道,网页由标签将信息组织起来,而标签的id属性值是唯一的 ...

  8. JS获取标签内容的方法

    JS获取标签内容的方法 测试代码 <!DOCTYPE html> <html lang="en"> <head> <meta charse ...

  9. jQuery div内容间隔1秒动态向上滚动HTML、JS代码

    demo1: <!DOCTYPE html> <html> <head> <title>div内容间隔1秒动态滚动</title> < ...

随机推荐

  1. MFC 小知识总结二

    1 UpdateData 不能及时更新控件内容 原因: UpdateData是通过数据交换实现改变控件显示的.改变了之后必需要调用一次OnPaint才干实现刷新. 因此,若是在一个函数里重复多次调用有 ...

  2. Office PPT中如何插入flash

    1 在"视图"选项中找到工具栏,控件工具箱,最后一个其他工具中的shockwave flash object 2 当鼠标变成十字架之后随便画一个矩形,然后会出现一个白色的矩形中间十 ...

  3. spring源代码系列(一)sring源代码编译 spring源代码下载 spring源代码阅读

    想对spring框架进行深入的学习一下,看看源码,提升和沉淀下自己,工欲善其事必先利其器,还是先搭建好开发环境吧. 环境搭建 sping源代码之前是svn管理,如今已经迁移到了github中了.新版本 ...

  4. Struts2远程代码执行漏洞预警

    近期struts2 框架再现高危远程命令执行漏洞,漏洞编号S2-045,CVE编号CVE-2017-5638.利用此漏洞可对使用了struts2框架的网站进行远程命令执行,对服务器造成威胁.请相关单位 ...

  5. Java从零开始学二十九(大数操作(BigIntger、BigDecimal)

    一.BigInteger 如果在操作的时候一个整型数据已经超过了整数的最大类型长度long的话,则此数据就无法装入,所以,此时要使用BigInteger类进行操作. 不可变的任意精度的整数.所有操作中 ...

  6. CentOS 下安装MySQL 默认源为5.1版本

    CentOS——默认为安装5.1版本,如果需要安装5.5版本,需要使用remi源 yum install mysql-server –enablerepo=remi   Ubuntu——默认为安装5. ...

  7. exception Access restriction: The type 'BASE64Encoder' is not API

      Created by Marydon on 1.情景展示 在eclipse中切换jdk版本后,报错信息为:exception Access restriction: The type 'BASE6 ...

  8. maven 找不到或无法加载主类

      maven 找不到或无法加载主类 CreateTime--2018年4月19日22:58:14 Author:Marydon 1.情景还原: 在maven管理的web项目中,单独运行Java类报错 ...

  9. HTTP协议详解之基本认证篇

    •什么是HTTP基本认证: 桌面应用程序也通过HTTP协议跟web服务器交互,桌面应用程序一般不会使用cookie,而是把‘用户名+:+密码’用base64编码之后的string放在request中的 ...

  10. 成为JavaGC专家(3)—如何监控Java垃圾回收机制(转载)

    原文:http://www.importnew.com/3146.html 为什么需要优化GC 或者说的更确切一些,对于基于Java的服务,是否有必要优化GC?应该说,对于所有的基于Java的服务,并 ...