定义和用法

innerHTML 属性设置或返回表格行的开始和结束标签之间的 HTML。

语法

tablerowObject.innerHTML=HTML

实例

下面的例子返回了表格行的 inner HTML：

<html>

<head>

<script type="text/javascript">

function getInnerHTML()

  {

  alert(document.getElementById("tr1").innerHTML);

  }

</script>

</head>

<body>

<table border="1">

<tr id="tr1">

<th>Firstname</th>

<th>Lastname</th>

</tr>

<tr id="tr2">

<td>Peter</td>

<td>Griffin</td>

</tr>

</table>

<br />

<input type="button" onclick="getInnerHTML()"

value="Alert innerHTML of table row" />

</body>

</html>

使用innerHTML 来实现图片的连续播放


 <script type=text/javascript>

 var speed=30

 marquePic2.innerHTML=marquePic1.innerHTML

 function Marquee(){

 if(demo.scrollLeft>=marquePic1.scrollWidth){

 demo.scrollLeft=0

 }

 else{

 demo.scrollLeft++

 }}

 var MyMar=setInterval(Marquee,speed)

 demo.onmouseover=function() {clearInterval(MyMar)}

 demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}

 </script>

 注：scrollLeft代表页面利用滚动条滚动到右侧时，隐藏在滚动条左侧的页面的宽度;

      scrollWidth获取对象的滚动宽度;

      详细解释：http://bluenemo.iteye.com/blog/1263429

 <div id=demo style="OVERFLOW: hidden; WIDTH: 760px; align: center">

   <table cellspacing="0" cellpadding="0" align="center"

 border="0">

     <tbody>

       <tr>

         <td id="marquePic1" valign="top">

 <table width="958" height="130" border="0" cellpadding="0" cellspacing="0">

   <tr>

     <td width="95" height="110" align="center">1</td>

     <td width="95" align="center">2</td>

     <td width="95" align="center">3</td>

     <td width="95" align="center">4</td>

     <td width="95" align="center">5</td>

     <td width="95" align="center">6</td>

     <td width="95" align="center">7</td>

     <td width="95" align="center">8</td>

     <td width="95" align="center">9</td>

     <td width="103" align="center">0</td>

   </tr>

   <tr>

     <td height="20" align="center" bgcolor="#CCCCCC">&nbsp;</td>

     <td align="center">&nbsp;</td>

     <td align="center">&nbsp;</td>

     <td align="center">&nbsp;</td>

     <td align="center">&nbsp;</td>

     <td align="center">&nbsp;</td>

     <td align="center">&nbsp;</td>

     <td align="center">&nbsp;</td>

     <td align="center">&nbsp;</td>

     <td align="center" bgcolor="#FFFF99">&nbsp;</td>

   </tr>

 </table>        

         </td>

         <td id="marquePic2" valign="top"></td>

       </tr>

     </tbody>

   </table>

 </div>

HTML DOM innerHTML 属性及实现图片连续播放的更多相关文章

  1. JavaScript Dom基础-9-Dom查找方法; 设置DOM元素的样式; innerHTML属性的应用; className属性的应用; DOM元素上添加删除获取属性;

    JavaScript Dom基础 学习目标 1.掌握基本的Dom查找方法 domcument.getElementById() Domcument.getElementBy TagName() 2.掌 ...

  2. CSS :first-child 选择器 和 HTML DOM firstChild 属性

    CSS 选择器参考手册 实例 选择属于其父元素的首个子元素的每个 <p> 元素,并为其设置样式: p:first-child { background-color:yellow; } 亲自 ...

  3. 标签的innerHTML属性和html()

    在新公司开发编码的时候,经常写js代码:有时候就需要往某个标签里添加一些html脚本或者要拿到某个标签里的html脚本,那么就会用到innerHTML和html. 1.innerHTML属性 w3sc ...

  4. innerHTML属性，outerHTML属性，textContent属性，innerText属性区别详解

    innerHTML属性用来读取或设置某个节点内的HTML代码. outerHTML属性用来读取或设置HTML代码时,会把节点本身包括在内. textContent属性用来读取或设置节点包含的文本内容. ...

  5. js dom element 属性整理（原创）

    最近去几家公司面试,发现大多数时候面试的内容考的都是原生的js语法和属性,所以我决心整理一下原生的dom元素的属性. 首先,我我们需要获取一个element元素 <li id="2&q ...

  6. 剑指前端（前端入门笔记系列）——DOM（属性节点）

    DOM(属性节点) 属性节点没有过参加家族关系中,其专用选择器:attributes,返回值为对象的形式,它的键是索引值,也就是用对象模拟了一个伪数组,DOM中选择器返回的都是伪数组(可以使用数组的形 ...

  7. 使用innerHTML属性向head中插入字符时报“无法设置 innerHTML 属性。 该操作的目标元件无效”的错误

    向head中动态插入script文件,代码如下: var sc = document.createElement("script"); sc.src = "//www.c ...

  8. innerHTML属性的内存和性能问题

    使用innerHTML替换子节点可能会导致浏览器的内存占用问题,尤其是在IE中,问题更加明显.在删除带有时间处理程序或引用了其他js对象子树是,就有可能导致内存占用问题.假设某个元素有一个事件处理程序 ...

  9. jQuery操纵DOM元素属性 attr()和removeAtrr()方法使用详解

    jQuery操纵DOM元素属性 attr()和removeAtrr()方法使用详解 jQuery中操纵元素属性的方法: attr(): 读或者写匹配元素的属性值. removeAttr(): 从匹配的 ...

随机推荐

  1. Zookeeper运维

    一.运维配置         参考:http://zookeeper.apache.org/doc/r3.4.6/zookeeperAdmin.html#sc_configuration 基础配置   ...

  2. 类模板语法知识体系梳理（包含大量常犯错误demo，尤其滥用友元函数的错误）

    demo 1 #include <iostream> #include <cstdio> using namespace std; //template <typenam ...

  3. 衡量android开发者水平的面试问题-android学习之旅（91）

    一般面试时间短则30分钟,多则1个小时,这么点时间要全面考察一个人难度很大,需要一些技巧,这里我不局限于回答题主的问题,而是分享一下我个人关于如何做好Android技术面试的一些经验: 面试前的准备 ...

  4. ORM对象关系映射之GreenDAO自定义属性转换器PropertyConverter

    在使用GreenDAO定义实体的属性时候,通常来说定义的实体属性名就是对应的表的字段名.实体中属性的类型(如Long.String等)就是表的字段名类型,但是我们难免会有不一样的需求,比如实体中我定义 ...

  5. STL算法设计理念 - 预定义函数对象

    预定义函数对象基本概念:标准模板库STL提前定义了很多预定义函数对象 1)使用预定义函数对象: #include <iostream> #include <cstdio> #i ...

  6. 【资源分享】云计算 CRM 等网上搜集资料

    持续更新,作为抛砖引玉,如果您有更好.更新的资源,望大家分享.共同学习.详细信息尽在 华夏编程社区(HackProLabs)-------------------------------------- ...

  7. 标准会话管理器——StandardManager

    用于保存状态的会话对象已经有了,现在就需要一个管理器来管理所有会话,例如会话id生成.根据会话id找出对应的会话.对于过期的会话进行销毁等等操作.用一句话描述标准会话管理器:提供一个专门管理某个web ...

  8. 怎样重建一个损坏的调用堆栈（callstack）

    原文作者:Aaron Ballman原文时间:2011年07月04日原文地址:http://blog.aaronballman.com/2011/07/reconstructing-a-corrupt ...

  9. Android TV listView焦点平滑移动

    先上TV上效果图 Mark下思路: package com.test.ui; import java.lang.reflect.Method; import android.annotation.Su ...

  10. Unity修改Particles Render Material（Unity3D开发之二十三）

    猴子原创,欢迎转载.转载请注明: 转载自Cocos2Der-CSDN,谢谢! 原文地址: http://blog.csdn.net/cocos2der/article/details/48372999 ...