JS实现控制表格单元格垂直对齐的方法
本文实例讲述了JS实现控制表格单元格垂直对齐的方法。分享给大家供大家参考。具体如下:
下面的代码控制指定的单元格靠底部垂直对齐
<!DOCTYPE html> <html> <head> <script> function valignCell() { var x=document.getElementById('myTable').rows[0].cells; x[0].vAlign="bottom"; } </script> </head> <body> <table id="myTable" border="1" height="70%"> <tr> <td>First cell</td> <td>Second cell</td> </tr> <tr> <td>Third cell</td> <td>Fourth cell</td> </tr> </table> <form> <input type="button" onclick="valignCell()" value="Vertical align cell content"> </form> </body> </html>
希望本文所述对大家的javascript程序设计有所帮助。
相关推荐
-
js获取单元格自定义属性值的代码(IE/Firefox)
复制代码 代码如下: // js取单元格自定义属性值,IE和FF下的不同实现 result+="<Item>" var isIE=document.all ? true : false; if(isIE)//IE { for (var i=0;i<obj.cells.length;i++) result+="<"+obj.cells[i].fieldname+"><![CDATA["+$(obj.cells[i
-
JS获取表格内指定单元格html内容的方法
本文实例讲述了JS获取表格内指定单元格html内容的方法.分享给大家供大家参考.具体如下: 下面的代码先通过表格对象的rows获得指定的行的所有单元格数组,然后定位指定的单元格,通过单元格的innerHTML属性获得单元格的html内容 <!DOCTYPE html> <html> <head> <script> function cell() { var x=document.getElementById('myTable').rows[0].cells;
-
js生成动态表格并为每个单元格添加单击事件的方法
html: 复制代码 代码如下: <html> <head> <title>Demo</title> </head> <body> <label style="font-size:20px;width:600px;" >动态表格:</label><br/> <table border="1"> <tbody id="table&qu
-
JS实现控制表格内指定单元格内容对齐的方法
本文实例讲述了JS实现控制表格内指定单元格内容对齐的方法.分享给大家供大家参考.具体如下: 下面的代码控制表格单元格的内容向右对齐 <!DOCTYPE html> <html> <head> <script> function alignCell() { document.getElementById('td1').align="right"; } </script> </head> <body> &l
-
JS获取单击按钮单元格所在行的信息
用JS获取表格中单击某个单元格中按钮,得到所在行的信息: 复制代码 代码如下: function GetRowNo() { var e = e || window.event; var target = e.target || e.srcElement; if (target.parentNode.tagName.toLowerCase() == "td") { rowIndex = target.parentNode.parentNode.rowIndex; } }
-
JS实现向表格行添加新单元格的方法
本文实例讲述了JS实现向表格行添加新单元格的方法.分享给大家供大家参考.具体如下: 下面的JS代码可以想表格中指定id的行插入新的单元格 <!DOCTYPE html> <html> <head> <script> function insCell() { var x=document.getElementById('tr1').insertCell(0); x.innerHTML="The famous"; } </script&
-
JS实现控制表格单元格垂直对齐的方法
本文实例讲述了JS实现控制表格单元格垂直对齐的方法.分享给大家供大家参考.具体如下: 下面的代码控制指定的单元格靠底部垂直对齐 <!DOCTYPE html> <html> <head> <script> function valignCell() { var x=document.getElementById('myTable').rows[0].cells; x[0].vAlign="bottom"; } </script>
-
JS实现控制表格行内容垂直对齐的方法
本文实例讲述了JS实现控制表格行内容垂直对齐的方法.分享给大家供大家参考.具体分析如下: 下面的代码通过表格的vAlign属性控制表格行的内容垂直对齐,可以置顶.可以居中.可以底部对齐 <!DOCTYPE html> <html> <head> <script> function topAlign() { document.getElementById('tr2').vAlign="top"; } </script> <
-
JS实现控制表格行文本对齐的方法
本文实例讲述了JS实现控制表格行文本对齐的方法.分享给大家供大家参考.具体如下: 下面的JS代码可以控制表格内的整行文本向左或者向右对齐 <!DOCTYPE html> <html> <head> <script> function leftAlign() { document.getElementById('header').align="left"; } </script> </head> <body&g
-
jQuery实现HTML表格单元格的合并功能
本文实例讲述了jQuery实现HTML表格单元格合并的方法.分享给大家供大家参考,具体如下: 运行效果截图如下: 合并前: 合并后: 具体代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.
-
jQuery实现点击表格单元格就可以编辑内容的方法【测试可用】
本文实例讲述了jQuery实现点击表格单元格就可以编辑内容的方法.分享给大家供大家参考,具体如下: 运行效果截图如下: 具体代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/
-
表格单元格交错着色实现思路及代码
[Title][原]表格单元格交错着色 [Abstract]以空间换时间,循环确定所着颜色. [Environment]jQuery [Author]wintys (wintys@gmail.com) http://wintys.cnblogs.com [Content]: 1.效果 2.问题描述 对如下表格中的单元格进行交错着色.表格中HTML标签.内容已定. 复制代码 代码如下: <div id="tablecontainer" align="center&quo
-
jQuery实现合并表格单元格中相同行操作示例
本文实例讲述了jQuery实现合并表格单元格中相同行操作.分享给大家供大家参考,具体如下: 合并的方法 $("#tableid").mergeCell({ cols:[X,X] ///参数为要合并的列 }) /** * 操作表格 合并单元格 行 * 2016年12月13日16:00:41 */ (function($) { // 看过jquery源码就可以发现$.fn就是$.prototype, 只是为了兼容早期版本的插件 // 才保留了jQuery.prototype这个形式 $.f
-
JavaScript动态改变表格单元格内容的方法
本文实例讲述了JavaScript动态改变表格单元格内容的方法.分享给大家供大家参考.具体如下: JavaScript动态改变表格单元格的内容,下面的代码通过修改单元格的innerHTML来修改单元格内容 <!DOCTYPE html> <html> <head> <script> function changeContent() { var x=document.getElementById('myTable').rows[0].cells; x[0].i
随机推荐
- AngularJS包括详解及示例代码
- JavaScript实现换肤功能
- 深入理解Vuex 模块化(module)
- Windows Vista 宽屏LCD提供的支持 与设置方法第1/2页
- Java如何在不存在文件夹的目录下创建文件
- visual studio 2017企业版本安装(附序列号)
- 再论Javascript的类继承
- Yii 2.0如何使用页面缓存方法示例
- Python的爬虫框架scrapy用21行代码写一个爬虫
- 深入理解JavaScript系列(41):设计模式之模板方法详解
- JavaScript数组的定义及数字操作技巧
- Shell中if的基本语法和常见判断用法
- c#中文转unicode字符示例分享
- JS触摸屏网页版仿app弹窗型滚动列表选择器/日期选择器
- js螺旋动画效果的具体实例
- php正则preg_replace_callback函数用法实例
- 解析如何在android中增加gsensor驱动(MMA7660)
- Android 重力传感器在游戏开发中的应用
- apache正常访问mht类型文件的配置方法
- python Matplotlib画图之调整字体大小的示例