`

点评无刷新评论(tBodies[0])

 
阅读更多

点评无刷新评论

<script type="text/javascript">

     function addComment(){

  var name = document.getElementById("name").value;

  var comment = document.getElementById("comment").value;

  var tableComment = document.getElementById("tableComment");

  var tr = document.createElement("tr");

  var td1 = document.createElement("td");

  td1.innerText = name;

  tr.appendChild(td1);

  

  var td2 = document.createElement("td");

  td2.innerText =comment ;

  tr.appendChild(td2);

  tableComment.tBodies[0].appendChild(tr);//tBodies[0]表示第一个表单。

  }

</script>

<table id="tableComment">

     <tbody>

      <tr><td>猫猫</td> <td>沙发耶 </td> </tr>

     </tbody>

 </table>

    昵称:<input id="name" type="text"><br>

    <textarea  id="comment" rows="2" cols="6"></textarea><br>

         <input type="button" value="评论" onclick="addComment()">  

<!--EndFragment-->

分享到:
评论

相关推荐

    javascript清空table表格的方法

    本文实例讲述了javascript清空table表格的方法。分享给大家供大家参考。具体如下: 1. 通常方法 循环table的rows,然后一个一个删除...var artBody=artTable.tBodies[0]; //clear table //artBody[removed]=''; //获取

    JS 动态增加table

    - `tBodies` 属性:HTML表格(`&lt;table&gt;`)对象有一个`tBodies`属性,它返回一个`HTMLCollection`,包含了表格中的所有`&lt;tbody&gt;`元素。 - `appendChild()`:此方法用于将一个节点添加为另一个节点的最后一个子节点...

    jQuery改写而成的一个Web选项卡效果。

    本案例探讨了如何利用jQuery库实现无需刷新页面的选项卡功能,不仅提高了用户体验,还增强了页面的交互性。 #### 目标设定 本次任务的目标是通过参考网络上的一个示例,使用jQuery来实现一个动态且无需页面刷新的...

    谷歌浏览器 insertCell与appendChild的区别

    在网页开发中,特别是在动态构建HTML表格时,`insertCell` 和 `appendChild` 是两种常见的方法,用于向表格中添加新的单元格(`&lt;td&gt;`元素)。这两种方法在谷歌浏览器中都有良好的支持,但它们的工作方式有所不同,...

    javascript对table的添加,删除行的操作

    4. **将行添加到表格**:最后,将`&lt;tr&gt;`添加到表格的`&lt;tbody&gt;`(或直接添加到`&lt;table&gt;`,如果不存在`&lt;tbody&gt;`),`tableElement.tBodies[0].appendChild(tr)`。 ### 删除行 1. **选择要删除的行**:可以基于用户的...

    JS实现列表页面隔行变色效果

    先看看隔行变色效果: 代码: &lt;head runat=server&gt; &lt;title&gt;... var otab = document.getElementById('tab1');... for (var i = 0;... otab.tBodies[0].rows.... otab.tBodies[0].rows[i].onmouseover = functio

    js 动态增加删除行hwh

    table.tBodies[0].appendChild(newRow); ``` 删除行则相对简单,通常通过获取行的引用,然后调用`removeChild`方法实现。例如,假设我们有一个`&lt;tr&gt;`元素的引用`rowToRemove`: ```javascript var table = document...

    关于&amp;lt; tbody &amp;gt;的一个实例,很实用。

    tbody Tab选项卡效果代码关键只是在和选项卡的设置上。...调用的时候是采用了遍历:将6个tBodies先全部都初始化\u4e3adisplay='none',然后紧接着将tBodies[n]设置\u4e3adisplay='block',将这一个tBodies显示出来。

    js+css做的tab菜单,代码很简洁,推荐使用!

    &lt;TABLE class=main_tab id=mainTable height=240 cellSpacing=0 cellPadding=0 width=549 border=0&gt; &lt;!-- 各个内容区域 --&gt; ``` 这里的`&lt;TABLE&gt;`元素作为容器,`&lt;TD&gt;`元素作为选项卡单元格,`onclick`属性绑定了`...

    JS动态增加删除行

    table.tBodies[0].appendChild(newRow); } // 动态删除行 function deleteRow(event) { if (event.target.tagName.toLowerCase() === 'td') { var rowToRemove = event.target.parentNode; rowToRemove....

    JS实现表格数据各种搜索功能的方法

    var str1 = oTab.tBodies[0].rows[i].cells[1].innerHTML.toUpperCase(); var str2 = oBt[0].value.toUpperCase(); if (str1 == str2) { oTab.tBodies[0].rows[i].style.background = 'red'; } else { oTab....

    js操作表格, 带初始化的

    var newRow = table.tBodies[0].insertRow(); ``` 在新行中插入单元格,我们可以使用`insertCell()`方法: ```javascript var newCell = newRow.insertCell(0); newCell.innerHTML = '内容'; ``` 接着是增加功能...

    JS实现点击表头表格自动排序(含数字、字符串、日期)

    var tbody = document.querySelector('#tableSort').tBodies[0]; var th = document.querySelector('#tableSort').tHead.rows[0].cells; var td = tbody.rows; for (var i = 0;i &lt; th.length;i++){ th[i].flag =...

    table 使用js 高效 动态添加行

    table.tBodies[0].appendChild(newRow); ``` 三、动态添加行的优化 1. 使用模板字符串:通过模板字符串,可以更方便地生成动态内容。 ```javascript var cellContent = `新内容${index}`; var newCell = document....

    使用JavaScript制作网页可变化表格

    table.tBodies[0].appendChild(tr); }); ``` 为了使表格可编辑,我们可以为每个单元格添加`contenteditable`属性。这将允许用户直接在单元格内编辑文本: ```javascript td.setAttribute('contenteditable', true...

    原生js可编辑表格实现动态添加表格行数和删除表格行数

    var newRow = table.tBodies[0].insertRow(); for (var i = 0; i [0].cells.length; i++) { newRow.insertCell(i); } } ``` 2. **删除行:** 删除行则使用`deleteRow()`方法,需要传入要删除的行的索引。...

    asp.net选项卡控件代码

    &lt;table border="0" cellspacing="0" cellpadding="0" width="800" height="800" id="mainTable" class="main_tab"&gt; ;"&gt; 内容1 ;"&gt; 内容2 ;"&gt; 内容3 ;"&gt; ``` #### 三、选项卡控件的...

    jQuery实现的表格前端排序功能示例

    本文实例讲述了jQuery实现的表格前端排序功能。分享给大家供大家参考,具体如下: 表格前端按列排序 依赖jQuery(本例使用jQuery-1.8.2) 1.初始化方法 ... var tbody = table.tBodies[0]; var tr = tbody.r

    js 对页面table数据排序

    rows.forEach(row =&gt; table.tBodies[0].appendChild(row)); } ``` 这个函数首先获取了表格的行数据,然后根据指定列的值进行排序。这里使用了`Array.prototype.sort`方法,它接受一个比较函数,用于确定元素的相对...

Global site tag (gtag.js) - Google Analytics