<!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/1999/xhtml">
<head>
<script type="text/javascript">
    
    
    //产生一个四位的验证码。
    function createCode(){
        var datas = ['A','B','何','敏','凡','江','1','9']; // 0-7  长度8
        var code = "";
        for(var i = 0 ; i<4; i++){
            //随机产生四个索引值
            var index =  Math.floor(Math.random()*datas.length); // random 0.0-1.0（不包括1.0）
            code+=datas[index];
        }    
        
        var spanNode = document.getElementById("code");
        spanNode.innerHTML = code;
        spanNode.style.fontSize ="24px";
        spanNode.style.color = "red";
        spanNode.style.backgroundColor="gray";
        spanNode.style.textDecoration = "line-through";
    }
    
function ready(){
    createCode();
}

</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body onload="ready()">
    <span id="code"></span><a href="#" onclick="createCode()">看不清，换一个</a>
    
</body>
</html>

JS操作CSS的更多相关文章

  1. JS操作css的float属性的特殊写法

    使用js操作css属性的写法是有一定的规律的: 1.对于没有中划线的css属性一般直接使用style.属性名即可. 如:obj.style.margin,obj.style.width,obj.sty ...

  2. js操作css样式，null和undefined的区别？

    1.js操作css的样式 div.style.width="100px"在div标签内我们添加了一个style属性,并设定了width值.这种写法会给标签带来大量的style属性, ...

  3. 11-13 js操作css样式

    1.Js操作css样式 Div.style.width=”100px”.在div标签内我们添加了一个style属性,并设定了width值.这种写法会给标签带来大量的style属性,跟实际项目是不符. ...

  4. js操作css样式、js的兼容问题

    一.js操作css样式 div . style . width="200px" 在div标签内我们添加了一个style属性,并设定width值.这种写法会给标签带来大量的style ...

  5. 通过JS操作CSS

    动态效果如图所示: 第一种实现方法: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " ...

  6. js 操作css

    类似于jquery的css()函数,js封装 CSS函数:css(oDiv , "width" , "200px ")设置样式css(oDiv , " ...

  7. JS操作CSS随机改变网页背景

    今天有个朋友在weibo上问我可不可以用JS和CSS让页面每次刷新随机产生一张背景图,当然我的回答是可以的.具体可以这样做: 1.用JS定义一个图片数组,里面存放你想要随机展示的图片 1 2 3 4 ...

  8. JS操作CSS样式

    一.样式表(css) 使用样式表可以更好的显示WEB文档,也可以结合javascript从而实现很好的控制样式表. 样式(css)与内容(html): HTML是处理文档结构的,HTML可以实现如何把 ...

  9. JS操作css样式用法

    //html <div id="div1" style="background:red;"> 修改背景颜色 </div> <but ...

  10. js操作css变量

    原文:http://css-live.ru/articles/dostup-k-css-peremennym-i-ix-izmenenie-spomoshhyu-javascript.html :ro ...

随机推荐

  1. OpenvSwitch代码分析之bridge和port

    ovs-vsctl add-br br0 会在数据库里面加入新bridge的信息ovs-vsctl add-port br0 eth0 会在数据库里面加入新的port信息 void bridge_ru ...

  2. 目标跟踪之高斯混合模型---cv实现

    #include <stdio.h>#include <cv.h>#include <cxcore.h>#include <highgui.h>#inc ...

  3. 记一次UICollectionView中visibleCells的坑

    记一次UICollectionView中visibleCells的坑 项目的要求是这样的 其实也是一个轮播图,而已,所以依照轮播图的实现原理,这里觉得也很简单,还是利用UICollectionView ...

  4. [IT学习]Python 小项目 通讯录 思路

    建立一个通讯录查询软件,暂时只支持按姓名检索.出发点:无需登录企业门户,即可检索.要注意保护员工手机号,除非他自己同意显示. 欢迎您访问www.cnblogs.com/viphhs.转载请联系作者授权 ...

  5. 一个DIV相对于另一个DIV定位

    <div style="position:relative"><div style="position:absolute; top:0px; left: ...

  6. mysql16---读写分离

    读写分离(负载平衡)(读写分离肯定要用到主从复制) 如果数据库压力很大,一台机器支撑不了,那么可以用mysql复制实现多台机器同步,将数据库的压力分散. 分表不能解决并发量大的问题. Sql语句发过来 ...

  7. Ubuntu系统下实现Android工程调用独立编译的C++程序和GMP、PBC库

    目的: 实现使用C++编写代码供Android工程调用.C++代码中可以使用STL库,也可以使用常用的由源码编译生成的库,如PBC.因为PBC是基于GMP库的,所以这里只记录了GMP和PBC库的编译安 ...

  8. leetcode 783. Minimum Distance Between BST Nodes 以及同样的题目 530. Minimum Absolute Difference in BST

    Given a Binary Search Tree (BST) with the root node root, return the minimum difference between the ...

  9. Spring配置事务的五种方式

    Java事务的类型有三种: JDBC事务. 可以将多个 SQL 语句结合到一个事务中.JDBC 事务的一个缺点是事务的范围局限于一个数据库连接.一个 JDBC 事务不能跨越多个数据库 JTA(Java ...

  10. 小程序-demo：小程序示例-page/component2

    ylbtech-小程序-demo:小程序示例-page/component2 以下将展示小程序官方组件能力,组件样式仅供参考,开发者可根据自身需求自定义组件样式,具体属性参数详见小程序开发文档. 1. ...