编写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. XAF使用数据库访问层缓存的提升性能

    很多时候,为了提升性能,我们可以给数据库访问层做缓存. 以下几步可以完成这个任务:1. 使用自定义的 XPObjectSpaceProvider1.1. 创建自定义的 XPObjectSpacePro ...

  2. 深入理解 C# 协变和逆变

    msdn 解释如下: “协变”是指能够使用与原始指定的派生类型相比,派生程度更大的类型. “逆变”则是指能够使用派生程度更小的类型. 解释的很正确,大致就是这样,不过不够直白. 直白的理解: “协变” ...

  3. 个人博客Week3

    必应软件客户端测评 话不多说 先来一张高大上的客户端界面截图! 首先 映入眼帘的就是四个主要的模块!(1)词典(2)例句(3)翻译(4)应用 (1)词典: 在查询词条的时候,一旦查询了一个词条就不能够 ...

  4. iOS - Swift PList 数据存储

    前言 直接将数据写在代码里面,不是一种合理的做法.如果数据经常改,就要经常翻开对应的代码进行修改,造成代码扩展性低.因此,可以考虑将经常变的数据放在文件中进行存储,程序启动后从文件中读取最新的数据.如 ...

  5. mysql概要(十四)索引(补充:外键级联操作)

    [ ON DELETE { NO ACTION | CASCADE | SET NULL | SET DEFAULT } ][ ON UPDATE { NO ACTION | CASCADE | SE ...

  6. LotteryDrawing

    import java.util.*; public class MyTest{ public static void main(String[] args){ Scanner in = new Sc ...

  7. [转载] 高流量大并发Linux TCP 性能调优

    原文: http://cenwj.com/2015/2/25/19 本文参考文章为: 优化Linux下的内核TCP参数来提高服务器负载能力 Linux Tuning 本文所面对的情况为: 高并发数 高 ...

  8. select实现输入模糊匹配与选择双重功能

    下载jqueryUI插件 引入 <link rel="stylesheet" type="text/css" href="/js/jquery/ ...

  9. jquery+ajax(用ajax.dll)实现无刷新分页

    利用ajax.dll那种方式的无刷新,在这就不说了,新朋友可以看下我的另一片文件http://www.cnblogs.com/dachuang/p/3654632.html 首先,这里用的是jquer ...

  10. maven初试2

    1.1.建立Hello项目 1.首先建立Hello项目,同时建立Maven约定的目录结构和pom.xml文件 Hello | --src | -----main | ----------java | ...