定义和用法

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. （三十八）从私人通讯录引出的细节II -数据逆传 -tableView点击 -自定义分割线

    项目中的警告是不会影响app发布的,例如引入第三方类库很容易引入警告. 细节1:跳转的数据传递. prepareForSegue: sender: 方法是在执行segue后,跳转之前调用这个方法,一般 ...

  2. EBS 可拓展的外部信用风险导入

    DECLARE l_msg_count NUMBER; l_msg_data VARCHAR2(2000); l_return_status VARCHAR2(30); l_cc_hold_comme ...

  3. Java进阶(八)Java加密技术之对称加密 非对称加密 不可逆加密算法

    对称加密 非对称加密 不可逆加密算法 根据密钥类型不同可以将现代密码技术分为两类:对称加密算法(私钥密码体系)和非对称加密算法(公钥密码体系). 1 对称加密算法 原理 对称加密算法中,数据加密和解密 ...

  4. 13_Android的生命周期

     Activity的生命周期图 2 Android生命周期中涉及到的几个过程 1．启动Activity:系统会先调用onCreate方法,然后调用onStart方法,最后调用onResume,Ac ...

  5. 《java入门第一季》之面向对象（private关键字与封装概念的初探）

    /* 定义一个学生类: 成员变量:name,age 成员方法:show()方法 在使用这个案例的过程中,发现了一个问题: 通过对象去给成员变量赋值,可以赋值一些非法的数据.例如:name你赋值了一个3 ...

  6. 关于精灵帧(Sprite Frame)的尺寸大小

    一个对象的精灵帧(Sprite Frame)有若干关于大小的尺寸. 比较容易混淆,这里记录下来区别: CCSpriteFrame *spriteFrame = self.spriteFrame; CG ...

  7. TCP中的MSS解读（转）

    本文摘录自TCP中的MSS解读. MSS 是TCP选项中最经常出现,也是最早出现的选项.MSS选项占4byte.MSS是每一个TCP报文段中数据字段的最大长度,注意:只是数据部分的字段,不包括TCP的 ...

  8. 漫谈jdbc

    本文可作为北京尚学堂jdbc课程的学习笔记; 简介 jdbc是什么东西? jdbc全称(Java Database Connectivity java数据库连接) 它是干什么的? 至于它是干什么的,那 ...

  9. 速度之王 — LZ4压缩算法（二）

    LZ4 (Extremely Fast Compression algorithm) 项目:http://code.google.com/p/lz4/ 作者:Yann Collet 本文作者:zhan ...

  10. Leetcode_252_Implement Stack using Queues

    本文是在学习中的总结,欢迎转载但请注明出处:http://blog.csdn.net/pistolove/article/details/48598773 Implement the followin ...