编写div属性时，经常需要尝试不同的样式，可以用Javascript写一个简单的div样式查看器，方便日常操作:

 <!DOCTYPE html>

 <html>

 <head lang="en">

     <meta charset="UTF-8">

     <title>div样式查看器</title>

     <style>

         #div1{

             height: 200px;

             width: 200px;

             background: gray;

         }

     </style>

     <script>

         function change(){

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

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

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

             alter(style,param,value);

         }

         function alter(style,param,value){

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

             if(style!="")

             {

                 div1[style][param]=value;

             }

             else

             {

                 div1[param]=value;

             }

         }

     </script>

 </head>

 <body>

     style:<input type="text" id="style"><br>

     param:<input type="text" id="param"><br>

     value:<input type="text" id="value"><br>

     <input type="button" value="change" onclick="change()"/>

     <div id="div1"></div>

 </body>

 </html>

Div样式查看器的更多相关文章

  1. 发布两款JQ小插件（图片查看器 + 分类选择器），开源

    图片查看器,github地址:https://github.com/VaJoy/imgViewer 效果如下: 这款当初大概写了2小时,有点匆忙地赶出来的,使用的接口很简单: $.bindViewer ...

  2. 用JQ仿造礼德财富网的图片查看器

    现在就职于一家P2P平台,自然也会关注同行其它网站的前端技术,今天要仿造的是礼德内页的一个图片查看器效果.不过说白了,无论人人贷也好礼德财富也好,很多地方的前端都做的不尽如人意,比如忽略细节.缺乏交互 ...

  3. 基于jQuery的一个简单的图片查看器

    项目中自己diy了一个图片查看器.因为初始代码不是自己的,只是在上面改了一下也没有弄的很漂亮.等以后有时间了在重写一下样式和封装,作为备用的只是积累吧.如果有童鞋有用到,完全可以在此基础上改,比较容易 ...

  4. js手写图片查看器（图片的缩放、旋转、拖拽）

    在做一次代码编辑任务中,要查看图片器.在时间允许的条件下,放弃了已经封装好的图片jq插件,现在自己手写js实现图片的缩放.旋转.推拽功能! 具体代码如下: <!DOCTYPE html> ...

  5. js实现图片查看器（图片的缩放、旋转、拖拽）

    一.关于图片查看器. 目前网络上能找到的图片查看器很多,谁便一搜就能出来.如:jquery.iviewer.js.Viewer.js这两个js文件,其中功能也足够满足大部分开发需求.但是单纯的就想实现 ...

  6. 网页中的图片查看器viewjs使用

    需求分析: 对于网页中的图片进行连续放大(便于用户清晰查看内容).缩小,旋转等操作,可以使用viewjs图片查看器插件实现. viewjs官方网址:https://github.com/fengyua ...

  7. angularjs1 自定义图片查看器(可旋转、放大、缩小、拖拽)

    笔记: angularjs1 制作自定义图片查看器(可旋转.放大.缩小.拖拽) 2018-01-12 更新  可以在我的博客  查看我 已经封装好的 纯 js写的图片查看器插件    博客链接 懒得把 ...

  8. 图像处理工具包ImagXpress中如何定义查看器的属性

    想要在图像处理控件ImagXpress中查看一个图像,首先需要创建一个查看器,之后你可以按照你自身的需要,来定义查看器的属性. 创建查看器 想要动态的创建一个查看器,需要先定义一个新的mageXVie ...

  9. 转: Windows如何打开和使用事件查看器管理计算机

    方法/步骤   1 右键单击"我的电脑"(win8中名称为"这台电脑.This Computer"),选择"管理",点击. 步骤阅读 2 出 ...

随机推荐

  1. VBA中自定义类和事件的(伪)注册

    想了解一下VBA中自定义类和事件,以及注册事件处理程序的方法. 折腾了大半天,觉得这样的方式实在称不上“注册”,所以加一个“伪”字.纯粹是瞎试,原理也还没有摸透.先留着,有时间再接着摸. 做以下尝试: ...

  2. .net 常用Response.ContentType

    来源:http://blog.csdn.net/navy235/article/details/5982319 不同的ContentType 会影响客户端所看到的效果.默认的ContentType为 ...

  3. 移动h5自适应布局

    问题一,分辨率Resolution适配:不同屏幕宽度,html元素宽高比和字体大小,元素之间的距离自适应,使用rem单位. 问题二,单位英寸像素数PPI适配:使用rem单位,文字会发虚.段落文字,使用 ...

  4. STL--map

    map--概述: 映射(Map)和多重映射(Multimap)是基于某一类型Key的键集的存在,提供对TYPE类型的数据进行快速和高效的检索. l对Map而言,键只是指存储在容器中的某一成员. lMu ...

  5. jquery动画遮罩

    以前一直以为遮罩都是鼠标移上去,改变透明度实现的,后来看到过这样的一个遮罩动画,然后今天自己写了一个,因为弹出的遮罩是圆形的,所以从美观上来说,这个遮罩效果更适合于方形图片. <div clas ...

  6. linux 查看是否安装perl模块

    这里介绍两种linux中查看perl模块是否安装的方法,一种是对于单体的模块,一种是对于群体的. 单体验证: [root@root ~]# perl -MShell -e "print\&q ...

  7. SQL Povit

    ),) ,,@logistics_code='All',@fee_type='All' ),) ,@strDateList='',@from_date=cast((ltrim(@yr)+'-'+ltr ...

  8. netbeans环境的建立

    这是一个简单的实验,熟悉NetBeans的IDE环境的开发 首先下载一个NetBeans,可以在官网上下https://netbeans.org/downloads/index.html 要装NetB ...

  9. cocos2d-x 3.X （二）创建动起来的精灵

    [参考文章]http://www.cnblogs.com/suguoqiang/archive/2013/04/03/2997316.html 在HelloWorldScene.h中声明void ro ...

  10. Redis基础知识之————如何处理客户端连接

    redis 连接建立 Redis Redis 通过监听一个 TCP 端口或者 Unix socket 的方式来接收来自客户端的连接,当一个连接建立后,Redis 内部会进行以下一些操作: 首先,客户端 ...