永远不知道你可以改变的内容,一个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. 【linux】重置fedora root密码

    I forget root password on fedora,debian.fedora 17 fedora 18 fedora 19 fedora 20 fedora 21 fedora .de ...

  2. Android动态设置字体颜色

    步骤: 1.在values目录下的strings.xml文件中加入颜色:比方 <color name="ccc">#ccc</color> 2.假设你直接这 ...

  3. 【解决】缺少libstdc++.so.6库的原因及解决的方法

    问题原因: 系统是64bit,该库是32bit的,在64bit系统上安装32bit库 解决的方法: 1. 查看哪个安装包包括该库:yum provides libstdc++.so.6    libs ...

  4. sqlite可视化工具推荐

    软件名称:SQLite Expert 下载地址:http://www.sqliteexpert.com/download.html 下载免费的Personal版本就可以了 我试用了SQLite Exp ...

  5. Linux文件类型(学习笔记六)

    一.Linux下的文件类型 普通文件:在由 ls –al 所显示出来的属性方面,第一个属性为 [ - ] 目录文件:在由 ls –al 所显示出来的属性方面,第一个属性为 [ d ] 设备文件:一般都 ...

  6. Simple example

    This is a simple example showing a small window. Yet we can do a lot with this window. We can resize ...

  7. jdbc第三天

    事务 什么是事务? 转账: 1. 给张三账户减1000元 2. 给李四账户加1000元 当给张三账户减1000元后,抛出了异常!这会怎么样呢?我相信从此之后,张三再也不敢转账了. 使用事务就可以处理这 ...

  8. 强制MySQL查询走索引和强制查询不缓存

    有些情况下,表中创建了索引但是EXPLAIN的查看执行计划的时候发现并没有走索引.是因为优化器认为该语句不使用索引效率更好. 当然也可以强制走索引.类似: SELECT uid,uname FROM ...

  9. 1z0-052 q209_5

    5: Your database is open and the LISTENER listener is running. The new DBA of the system stops the l ...

  10. python 读帧和绘图的区别

    capture = cv2.VideoCapture(0) while True: #img = cv.QueryFrame(capture) ret, frame = capture.read() ...