<!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. Navicat for MySQL中文破解版免费下载

    不知道用过MySQL workbench数据库的朋友或站长有没有都遇到过这样的问题? 就是用ssh的连接方式连接数据库的时候,第一次可以连接的上,但是第二次就不行了,以后再用workbench就再也连 ...

  2. 最齐全的站点元数据meta标签的含义和使用方法

    最齐全的站点元数据meta标签的含义和使用方法 随着HTML5的流行和Web技术的不断演变,Meta标签队伍也越来越壮大,从Windows XP的IE6到现在Windows 7.Windows 8的I ...

  3. [读书笔记]《没人会告诉你的PPT真相》

    这本书分了三部分.第一部分偏重于基础技能,其中分为三部分,打印.放映.保存.第二部分是进阶,分为模板下载.模板修改.增加自定义页面等.第三部分是打造商业范的PPT,分为商业范的特征,具体技能体现(重复 ...

  4. Vue常用语法及命令

    1,Vue常用语法 vue常用语法之变量的定义 // 1,变量相关 // 变量的提升 var username = "雪雪"; var username ; console.log ...

  5. java8--集合(疯狂java讲义3复习笔记)

    1.集合分四类:set,map,list,queue 位于java.util包下. 集合类和数组的区别,数组可以保存基本类型的值或者是对象的引用,而集合里只能保存对象的引用. 集合类主要由两个接口派生 ...

  6. kernel: audit: printk limit exceeded

    问题: 小长假的第一天早上8:18一个数据,被定时任务中的脚本漏处理: 查定时任务的日志,发现调度异常 查var messages-20171231 日志信息,排查问题. http://man7.or ...

  7. RDD基础

    RDD的两种操作 1.Tansformation(转化操作):返回值还是一个RDD 2.Action(行动操作):返回值不是一个RDD      第一种Transformation是返回一个新的RDD ...

  8. UI：沙盒

    IOS平台下,沙盒的本质就是一个文件夹 每一款IOS应用安装在手机上都会自动的生成一个文件夹.之所以叫沙盒,就是因为这个文件夹是每次运行随机产生的文件夹.沙盒文件夹是独立的,每个应用之间不能互相访问. ...

  9. C#6.0的新特性之内插字符串

    https://docs.microsoft.com/zh-cn/dotnet/csharp/language-reference/keywords/interpolated-strings C# 6 ...

  10. 3 Java对象的内存布局以及对象的访问定位

    先来看看Java对象在内存中的布局   一 Java对象的内存布局 在HotSpot虚拟机中,对象在内存中的布局分为3个区域 对象头(Header) Mark Word(在32bit和64bit虚拟机 ...