编程 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函数

Nov 20 Javascript

IE与firefox下Dhtml的一些区别小结

Dec 02 Javascript

javascript demo 基本技巧

Dec 18 Javascript

js ondocumentready onmouseover onclick onmouseout 样式

Jul 22 Javascript

js模仿html5 placeholder适应于不支持的浏览器

Jan 13 Javascript

JS来动态的修改url实现对url的增删查改

Sep 05 Javascript

jquery获取及设置outerhtml的方法

Mar 09 Javascript

javascript中动态函数用法实例分析

May 14 Javascript

angular.js分页代码的实例

Jul 27 Javascript

深入浅出ES6之let和const命令

Aug 25 Javascript

jQuery实现的图片轮播效果完整示例

Sep 12 Javascript

Node.js 实现简单的接口服务器的实例代码

May 23 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 页面编码声明方法详解(header或meta)

2010/03/12 PHP

PHP数组排序函数合集以及它们之间的联系分析

2013/06/27 PHP

PHP实现获取并生成数据库字典的方法

2016/05/04 PHP

php通过smtp邮件验证登陆的方法

2016/05/11 PHP

php实现微信分享朋友链接功能

2019/02/18 PHP

PHP常见的几种攻击方式实例小结

2019/04/29 PHP

Yii框架操作cookie与session的方法实例详解

2019/09/04 PHP

一段利用WSH修改和查看IP配置的代码

2008/05/11 Javascript

window.opener用法和用途实例介绍

2013/08/19 Javascript

JS画5角星方法介绍

2013/09/17 Javascript

jQuery实现炫酷的鼠标轨迹特效

2015/02/01 Javascript

jQuery实现文本展开收缩特效

2015/06/03 Javascript

Javascript中实现String.startsWith和endsWith方法

2015/06/10 Javascript

jquery实现拖动效果（代码分享）

2017/01/25 Javascript

jQuery中map函数的两种方式

2017/04/07 jQuery

基于react组件之间的参数传递(详解)

2017/09/05 Javascript

angular2 ng2-file-upload上传示例代码

2018/08/23 Javascript

Vue 框架之键盘事件、健值修饰符、双向数据绑定

2018/11/14 Javascript

vue-cli3+ts+webpack实现多入口多出口功能

2019/05/30 Javascript

vue项目中运用webpack动态配置打包多种环境域名的方法

2019/06/24 Javascript

node.js实现带进度条的多文件上传

2020/03/27 Javascript

vue路由切换时取消之前的所有请求操作

2020/09/01 Javascript

[02:12]打造更好的电竞完美世界：完美盛典回顾篇

2018/12/19 DOTA

Python利用带权重随机数解决抽奖和游戏爆装备问题

2016/06/16 Python

python回调函数中使用多线程的方法

2017/12/25 Python

对Python 两大环境管理神器 pyenv 和 virtualenv详解

2018/12/31 Python

python实现抖音点赞功能

2019/04/07 Python

使用pytorch搭建AlexNet操作(微调预训练模型及手动搭建)

2020/01/18 Python

使用Django和Postgres进行全文搜索的实例代码

2020/02/13 Python

Python 序列化和反序列化库 MarshMallow 的用法实例代码

2020/02/25 Python

Pycharm修改python路径过程图解

2020/05/22 Python

套娃式文件夹如何通过Python批量处理

2020/08/23 Python

学生违纪检讨书200字

2014/10/21 职场文书

学校元旦晚会开场白

2014/12/14 职场文书

父亲婚礼答谢词

2015/01/04 职场文书

OpenCV-Python使用cv2实现傅里叶变换

2021/06/09 Python