<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="http://cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script>
<script src="http://mockjs.com/dist/mock.js"></script>
</head>
<body>
<div>
<h1 id="mockjs">mockjs</h1>
</div>
<script type="text/javascript">
//调用mock方法模拟数据
Mock.mock(
'http://mockjs', {
"userName" : '@name', //模拟名称
"age|1-100":100, //模拟年龄(1-100)
"color" : "@color", //模拟色值
"date" : "@date('yyyy-MM-dd')", //模拟时间
"url" : "@url()", //模拟url
"content" : "@cparagraph()", //模拟文本
"image":"@image()",
"images":"@image('200x100', '#00405d', '#FFF', 'Mock.js')",
"dataImage":"@dataImage",
dataImage:"@dataImage('200x100')",
dataImage:"@dataImage('200x100', 'Hello Mock.js!')"
}
);
//ajax请求
$("#mockjs").click(function(){
$.ajax({
url : "http://mockjs", //请求的url地址
dataType : "json", //返回格式为json
async : true, //请求是否异步，默认为异步，这也是ajax重要特性
data : {}, //参数值
type : "GET", //请求方式
beforeSend : function() {
//请求前的处理
},
success: function(req) {
//请求成功时处理
console.log(req);
},
complete: function() {
//请求完成的处理
},
error: function() {
//请求出错处理
}
});
});
var M=Mock.mock;
var R=R = window.Mock.Random;
console.log(R.email())
// basic：https://github.com/nuysoft/Mock/wiki/Basic
console.log(M({boolean:'@boolean'}))
console.log(M({natural:'@natural'}))
console.log(M({integer:'@integer'}))
console.log(M({float:'@float'}))
console.log(M({character:'@character'}))
console.log(M({range:'@range'}))
// date:https://github.com/nuysoft/Mock/wiki/Date
console.log(M({date:'@date'}))
console.log(M({time:'@time'}))
console.log(M({datetime:'@datetime'}))
console.log(M({now:'@now'}))
// Image：https://github.com/nuysoft/Mock/wiki/Image
console.log(M({image:"@image()"}))
console.log(M({image:"@image(60x60)"}))
console.log(M({image:"@image(60x60,#000000)"}))
console.log(M({image:"@image('200x100', '#00405d', '#FFF', 'Mock.js')"}))
console.log(M({dataImage:'@dataImage'}))
console.log(M({dataImage:"@dataImage('200x100')"}))
console.log(M({dataImage:"@dataImage('200x100', 'Hello Mock.js!')"}))
// color : https://github.com/nuysoft/Mock/wiki/Color
console.log(M({color:'@color'}))
console.log(M({hex:'@hex'}))
console.log(M({rgb:'@rgb'}))
console.log(M({rgba:'@rgba'}))
console.log(M({hsl:'@hsl'}))
// text : https://github.com/nuysoft/Mock/wiki/Text
console.log(M({paragraph:'@paragraph'}))
console.log(M({sentence:'@sentence'}))
console.log(M({title:'@title'}))
console.log(M({cparagraph:'@cparagraph'}))
console.log(M({csentence:'@csentence'}))
console.log(M({cword:'@cword'}))
console.log(M({ctitle:'@ctitle'}))
// name : https://github.com/nuysoft/Mock/wiki/Name
console.log(M({first:'@first'}))
console.log(M({last:'@last'}))
console.log(M({name:'@name'}))
console.log(M({cfirst:'@cfirst'}))
console.log(M({clast:'@clast'}))
console.log(M({cname:'@cname'}))
// Web　：　https://github.com/nuysoft/Mock/wiki/Name
console.log(M({url:'@url'}))
console.log(M({domain:'@domain'}))
console.log(M({email:'@email'}))
console.log(M({ip:'@ip'}))
console.log(M({tld:'@tld'}))
// address: https://github.com/nuysoft/Mock/wiki/Name
console.log(M({region:'@region'}))
console.log(M({province:'@province'}))
console.log(M({city:'@city'}))
console.log(M({county:'@county'}))
console.log(M({zip:'@zip'}))
// helper Methods : https://github.com/nuysoft/Mock/wiki/Helper
console.log(M({capitalize:'@capitalize(`hello`)'}))
console.log(M({upper:'@upper(`hello`)'}))
console.log(M({lower:'@lower(`HELLO`)'}))
console.log(M({pick:"@pick(['a', 'e', 'i', 'o', 'u'])"}))
console.log(M({shuffle:"@shuffle(['a', 'e', 'i', 'o', 'u'])"}))
// Miscellaneous: https://github.com/nuysoft/Mock/wiki/Miscellaneous
console.log(M({guid:'@guid'}))
console.log(M({id:'@id'}))
console.log(M({increment:'@increment'}))
</script>
</body>
</html>

mock js使用方法简单记录的更多相关文章

  1. jquery方法简单记录

      append() - 在被选元素的结尾插入内容 prepend() - 在被选元素的开头插入内容 after() - 在被选元素之后插入内容 before() - 在被选元素之前插入内容 firs ...

  2. 对JS 的classList 简单记录

    一 对classList整体感觉 浏览器支持参考(http://www.runoob.com/jsref/prop-element-classlist.html) classList 是一个对象 ,返 ...

  3. 创建ajax对象并兼容多个浏览器方法简单记录

    这篇文章主要介绍了如何创建ajax对象并兼容多个浏览器,需要的朋友可以参考下<script> function createAjax(){ var request=false; //win ...

  4. js实用方法记录-简单cookie操作

    js实用方法记录-简单cookie操作 设置cookie:setCookie(名称,值,保存时间,保存域); 获取cookie:setCookie(名称); 移除cookie:setCookie(名称 ...

  5. .net mvc 站点自带简易SSL加密传输 Word报告自动生成（例如 导出数据库结构） 微信小程序：动画（Animation） SignalR 设计理念(一) ASP.NET -- WebForm -- ViewState ASP.NET -- 一般处理程序ashx 常用到的一些js方法，记录一下 CryptoJS与C#AES加解密互转

    .net mvc 站点自带简易SSL加密传输   因项目需要,传输数据需要加密,因此有了一些经验,现简易抽出来分享! 请求:前端cryptojs用rsa/aes 或 rsa/des加密,后端.net ...

  6. swfobject.js 2.2简单使用方法

    swfobject.js 2.2简单使用方法 官方网址介绍http://code.google.com/p/swfobject/wiki/documentation 用法:html部分<div ...

  7. 分享几个日常调试方法让js调试更简单

    下面分享几个日常调试代码的时候在Console命令行显示你的操作,让你的js调试更简单. console显示信息的命令 在浏览器按f12在console上显示你的文本. <!DOCTYPE ht ...

  8. js实用方法记录-js动态加载css、js脚本文件

    js实用方法记录-动态加载css/js 附送一个加载iframe,h5打开app代码 1. 动态加载js文件到head标签并执行回调 方法调用:dynamicLoadJs('http://www.yi ...

  9. js实用方法记录-指不定哪天就会用到的js方法

    js实用方法记录-指不定哪天就会用到的js方法 常用或者不常用都有 判断是否在微信浏览器中 测试代码:isWeiXin()==false /** * 是否在微信中 */ function isWeix ...

随机推荐

  1. linux中的strings命令

     strings - print the strings of printable characters in files.            意思是, 打印文件中可打印的字符.  我来补充一下吧 ...

  2. 关于linux系统CPU篇--->CPU使用率升高

    1.CPU使用率为单位时间内CPU使用情况的统计,以百分比的方式展示. LINUX作为一个多任务操作系统,将每个CPU的时间划分为很短的时间片,再通过调度器轮流分配给各个任务使用,因此造成多任务同时运 ...

  3. python基础部分----基本数据类型

    0.文章来源:http://www.cnblogs.com/jin-xin/articles/7562422.html 1.数字 2.bool 3.str字符串 3.1.字符串的索引与切片. 索引即下 ...

  4. 2、每日复习点--ConcurrentHashMap vs HashMap vs HashTable

    HashMap:允许键或者值为null.底层是基于数组+链表的结构.默认初始容量是16,默认加载因子是0.75F,默认扩容增加一倍.如果指定了初始容量n,n必然在(2x,2x+1]范围内,n经过运算所 ...

  5. pandas替换一列中的汉字为数字

    表格的一列“总金额”应该全部为数字,但其中少数项出现汉字,应该将汉字替换为数字,才能进行后面的计算. 先定义一个函数: def is_number(s): try: float(s) return T ...

  6. 你不知道的JS（3）来聊聊this

    为什么要使用this?什么是this? 来看一段代码 function identify() { return this.name.toUpperCase(); } function speak() ...

  7. 0x14哈希之兔子兔子

    参考链接:https://www.cnblogs.com/wyboooo/p/9813428.html 题目链接:https://www.acwing.com/problem/content/140/ ...

  8. Cordova开箱注意事项

    在进行cd 目录切换的时候 一定要 注意大小写 不然 node_modules 下的依赖包 会报错 区分大小写 Cordova 在打包的时候报错 一般是版本或sdk问题 cordova 的版本要和co ...

  9. CentOS7.5 下搭建SFTP

    CentOS7.5 下搭建SFTP Linux 创建用户组 groupadd sftp 创建用户test useradd -G sftp -s /sbin/nologin test -s 禁止用户ss ...

  10. 连接MySQL报错The server time zone value 'Öйú±ê׼ʱ¼ä' is unrecognized or represents more than one time zone.

    MySQL time zone 时区错误 使用root用户登陆执行命令: ---> show variables like '%time_zone%'; 默认值system为美国时间:如下图: ...