编程 Javascript

javascript实现通过表格绘制颜色填充矩形的方法

Posted in Javascript onApril 21, 2015

本文实例讲述了javascript实现通过表格绘制颜色填充矩形的方法。分享给大家供大家参考。具体如下：

<html>
 <head>
  <title> Javascript画矩形 </title>
 <script type="text/javascript">
  //定义函数，传入设置参数，返回一个有背景颜色的表格
  function drawFilledRect(x,y,w,h,color)
  {
   document.write("<table border='0' cellspacing=0 cellpadding=0><tr><td style='position: absolute; left: "+(x)+"; top: "+(y)+";background-color: "+color+"' width="+(w)+" height="+(h)+"></td></tr></table>")
  }
 </script>
 </head>
 <body >
 <script type="text/javascript">
  //调用两次画矩形的函数
  drawFilledRect(20,80,100,100,"red");
  drawFilledRect(20,180,100,100,"lime");
 </script>
 </body>
</html>

希望本文所述对大家的javascript程序设计有所帮助。

- Author -

小萝莉

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

用js判断用户浏览器是否是XP SP2的IE6

Mar 08 Javascript

javascript 动态参数判空操作

Dec 22 Javascript

『jQuery』名称冲突使用noConflict方法解决

Apr 22 Javascript

Jquery加载时从后台读取数据绑定到dropdownList实例

Jun 09 Javascript

JS判断对象是否存在的10种方法总结

Dec 23 Javascript

js弹出确认是否删除对话框

Mar 27 Javascript

jQuery中:eq()选择器用法实例

Dec 29 Javascript

Nginx上传文件全部缓存解决方案

Aug 17 Javascript

BootStrap 动态添加验证项和取消验证项的实现方法

Sep 28 Javascript

Angular2实现自定义双向绑定属性

Mar 22 Javascript

bootstrap常用组件之头部导航实现代码

Apr 20 Javascript

一篇文章带你搞懂Vue虚拟Dom与diff算法

Aug 25 Javascript

jQuery标签编辑插件Tagit使用指南

Apr 21 #Javascript

jQuery背景插件backstretch使用指南

Apr 21 #Javascript

jQuery关键词说明插件cluetip使用指南

Apr 21 #Javascript

纯js实现重发验证码按钮倒数功能

Apr 21 #Javascript

jQuery滚动条插件nanoscroller使用指南

Apr 21 #Javascript

jQuery验证插件validation使用指南

Apr 21 #Javascript

jQuery拖拽插件gridster使用指南

Apr 21 #Javascript

You might like

php adodb操作mysql数据库

2009/03/19 PHP

PHP使用mysqldump命令导出数据库

2015/04/14 PHP

jQuery '行 4954 错误: 不支持该属性或方法' 的问题解决方法

2011/01/19 Javascript

jQuery总体架构的理解分析

2011/03/07 Javascript

jquery 提示信息显示后自动消失的具体实现

2013/12/18 Javascript

Nodejs中调用系统命令、Shell脚本和Python脚本的方法和实例

2015/01/01 NodeJs

微信中一些常用的js方法汇总

2015/03/12 Javascript

学习JavaScript正则表达式

2015/11/13 Javascript

jQuery ajax分页插件实例代码

2016/01/27 Javascript

浅谈JavaScript变量的自动转换和语句

2016/06/12 Javascript

微信小程序实现点击添加移除class

2017/06/12 Javascript

AngularJS实现tab选项卡的方法详解

2017/07/05 Javascript

webpack配置打包后图片路径出错的解决

2018/04/26 Javascript

关于element-ui的隐藏组件el-scrollbar的使用

2019/05/29 Javascript

vue如何实现自定义底部菜单栏

2019/07/01 Javascript

JS 数组基本用法入门示例解析

2020/01/16 Javascript

vue-cli或vue项目利用HBuilder打包成移动端app操作

2020/07/29 Javascript

vue 动态组件(component :is) 和 dom元素限制(is)用法说明

2020/09/04 Javascript

[00:48]食人魔魔法师至宝“金鹏之幸”全新模型和自定义特效展示

2019/12/19 DOTA

Flask入门教程实例：搭建一个静态博客

2015/03/27 Python

深入讲解Python中的迭代器和生成器

2015/10/26 Python

python搭建微信公众平台

2016/02/09 Python

Mac中升级Python2.7到Python3.5步骤详解

2017/04/27 Python

django表单实现下拉框的示例讲解

2018/05/29 Python

python调用tcpdump抓包过滤的方法

2018/07/18 Python

Python+OpenCV实现将图像转换为二进制格式

2020/01/09 Python

Python运行DLL文件的方法

2020/01/17 Python

python如何编写win程序

2020/06/08 Python

python 如何利用argparse解析命令行参数

2020/09/11 Python

CSS3 Notes: -webkit-box-reflect实现倒影的实例

2016/12/08 HTML / CSS

《燕子》教学反思

2014/02/18 职场文书

纠风工作实施方案

2014/03/15 职场文书

国家税务局领导班子对照检查材料思想汇报

2014/10/04 职场文书

安全承诺书

2015/01/19 职场文书

2015年服务员个人工作总结

2015/05/27 职场文书

酒会开场白大全

2015/06/01 职场文书