- 博客(36)
- 收藏
- 关注
RSS订阅原创 《Hello Vue.js之道阻且长》
一、环境安装问题由于nodejs安装错误的历史问题，在系统高级设置里将path改的我完全不认识了，因此导致Vue.js安装困难重重。首先在执行npm install --global vue-cli命令之后，出现如下图的错误，vue根本没有安装上。经过多方检查，最后终于找到问题了。原因在于我之前nodejs配置path时，大概哪个环境变量修改了。导致找不到node_glob
2017-10-22 09:51:18
283
原创 变量、数据与数组操作
一、数据类型转换 //转换成数字 var str = "11"; var bool = true; console.log(typeof (str-0)); console.log(typeof (bool-0)); console.log(typeof (str*1)); console.log(typeof (bool*1)); console.lo
2017-10-05 21:12:49
357
原创 JS的Dom和事件处理机制（三）
一、事件监听原理 var btn = document.getElementsByTagName("button")[0];// btn.addEventListener("click",fn1);// btn.addEventListener("click",fn2); fn("click",fn1,btn); function fn1(){
2017-10-05 20:34:32
353
原创 JS的Dom和事件处理机制（ 二）
一、节点获取和访问关系 //parentNode父盒子 var box3 = document.getElementById("box3"); box3.parentNode.style.backgroundColor = "blue"; //兄弟节点（前一个和后一个：previousSibling和nextSibling） //previousElement
2017-10-05 15:05:46
304
原创 JS的Dom和事件处理机制（ 一）
一、1.事件源（引发后续事件的标签） 2.事件（js已经定义好，直接使用） 3.事件驱动程序（对样式和html的操作）（DOM操作）1.获取事件源（document.getElementById("box")）2.绑定事件 （事件源.事件 = function(){ 事件驱动程序 }）3.书写事件驱动程序。 //1.获取事件源（document.getE
2017-10-05 12:54:36
412
原创 拖曳案例
window.onload = function () { //需求：在指定位置按住鼠标左键移动对话框。 //分析：鼠标按下，触动事件，移动在更换对话框的位置。 //鼠标按下onmousedown 鼠标弹起:onmouseup 鼠标移动onmousemove //步骤：
2017-09-17 19:40:04
279
原创 手风琴效果
调用jQuery的animate动画函数，能实现动画变形，以此实现动画效果。 window.onload = function () { //需求：鼠标放入到li中该盒子变宽，其他的盒子变窄。移开大盒子，回复原样。 //步骤： //1.给li添加背景 //2.绑定onmouseover事件，鼠标放入
2017-09-17 18:47:41
340
原创 jQuery下拉框
用jQuery实现动画效果，简单到令人发指 $(document).ready(function () { //需求：鼠标放入一级li中，让他里面的ul显示。移开隐藏。 var jqli = $(".wrap>ul>li"); //绑定事件 jqli.mouseenter(function ()
2017-09-17 17:07:01
283
原创 淘宝放大镜
需求：鼠标放到小盒子上，让大盒子里面的图片和我们同步等比例移动。技术点：onmouseenter==onmouseover 第一个不冒泡技术点：onmouseleave==onmouseout 第一个不冒泡步骤：1.鼠标放上去显示盒子，移开隐藏盒子。2.老三步和新五步（黄盒子跟随移动）3.右侧的大图片，等比例移动。1、获取相关元素 var box = do
2017-09-17 15:53:23
306
原创 旋转轮播图
animate:function animate(obj,json,fn) { // 第一参数 动的对象 2 attr 动的那个属性 3 属性值少多少 clearInterval(obj.timer); obj.timer = setInterval(function() { var flag = true; // 用来判断是否停止定
2017-09-17 15:48:34
329
原创 无缝轮播图
超重要动画封装函数： function animate(ele,target){ clearInterval(ele.timer); var speed = target>ele.offsetLeft?10:-10; ele.timer = setInterval(function () {
2017-09-17 14:49:36
311
原创 微信小程序学习笔记
1、基本骨架结构：wxml: Hello, 宇智波胖虎 开启小程序之旅 单位：rpx可以根据屏幕宽度进行自适应，1rpx = 0.5px = 1物理像素，可以用 iPhone6 作为视觉稿的标准。小程序中用到的px，是逻辑物理像素，所以大小是设计图大小的一半。弹性布局：display:flex;flex-dir
2017-08-22 13:00:06
313
原创 CSS基础知识
1、清除浮动有三个方法：div{clear:both}、父元素overflow: auto（hidden也可以，但对seo不友好）伪类选择器：.outer :after {clear:both;content:'.';display:block;width: 0;height: 0;visibility:hidden;}等待补充中……
2017-08-22 00:31:58
171
转载 css 盒子模型理解
转载自：http://www.cnblogs.com/clearsky/p/5696286.html盒子模型是html+css中最核心的基础知识，理解了这个重要的概念才能更好的排版，进行页面布局。下面是自己积累和总结的关于css盒子模型的知识^_^，希望对初学者有用。一、css盒子模型概念CSS css盒子模型 又称框模型 (Box Model) ，包含了元
2017-08-22 00:23:44
214
原创 科大讯飞手写识别
$(function() { // $.ajax({ // url : , // type : 'GET', // async: true, // dataType: 'json', // timeout: 7000, // data : { // tel : $('#tel').val(), // pass : $('#
2017-08-21 22:32:58
3995
原创 web书城开发总结
一、技术点1、使用Base64格式的图片制作ICON，页面可以直接加载，减少请求，加快首屏数据的显示速度。字符串包含了数据信息：url(data:image/png;base 64,图片字符串信息)缺点：不利于维护2、CSS3比Base64体积小，但不易于维护，存在兼容性问题。3、提高h5web性能：1、减少或避免repaint、reflow2、尽量缓存所有可以缓存的数
2017-08-19 21:32:21
717
原创 JS高级基础知识
1、值类型： string number boolean undefined 存储的就是数据本身的变量就是值类型的数据 值类型的赋值： 直接将存储的数据复制一份进行赋值，两份数据在内存中是完全独立的 值类型做函数的参数： 函数内部的变量，也就是形参和实参只是简单的赋值操作，两个数据独立存储于内存中的
2017-08-18 14:16:34
451
原创 less基础知识
@media screen and (min-width: 480px) { body { background-color: lightgreen; } }@media screen and (max-width: 300px) { body { background-color: skyblue;
2017-08-16 17:22:15
166
原创 封装tap事件
知识点：通过三种touch方法，计算触摸屏幕的时间，实现长按触发事件。 window.onload = function () { // 参数1dom // 参数2回调 fox_tap(document.body,function(e){ console.log('自己写的逻辑'); console.log(e); }) }/* 参数1:绑定的do
2017-08-16 16:30:53
480
原创 前端JS案例（二）：自动轮播+手动拨动
一、自动轮播html代码： JS代码：function banner() { //1 获取变量 // 屏幕的宽度 var width =
2017-08-15 19:45:17
6602
1
原创 前端JS案例（一）：倒计时
倒计时案例解析：1、设置var timeId = setInterval(function(){},时间毫秒); 通常为每隔1000毫秒执行一次。2、在函数中设置if条件，在某种情况下清除timeId，clearInterval(timeId);3、如下所示设置小时、分钟、秒 var totalSec = 3*60*60; var hour = Math.f
2017-08-15 16:05:11
1420
转载 Sublime Text 全程指引
文章原文地址：http://www.cnblogs.com/figure9/p/sublime-text-complete-guide.html摘要（Abstract）本文系统全面的介绍了Sublime Text，旨在成为最优秀的Sublime Text中文教程。更新记录2014/09/27：完成初稿2014/09/28：更正打开控制台的快捷键为Ct
2017-08-15 13:03:21
164
原创 移动web开发基础知识
1、2、-webkit-tap-highlight-color: transparent; （透明）/*手指点击，默认高亮效果*/ -webkit-appearance: none; /* 移动端 有一些 浏览器 会默认给 input标签 添加一些 特有的样式 比如 3d 高光效果 */3、 /* 保证 内容的大小不变 */box-sizing: content-bo
2017-08-14 15:09:07
295
原创 天气案例
Document " alt=""> " alt=""> $("input").click(function () { $.ajax({ url:"http://api.map.baidu.com/telematics/v3/weather?location=上海&output=json&a
2017-08-13 16:28:28
491
转载 前端题部分总结（二）
前端页面优化答：1. 减少http请求，2.-e 3.尽量静态页面，从简原则 4.代码规范 Css盒模型答：magin+border+padding+width ,当设置background颜色的时候，会覆盖padding+width（其实还有border，因为当border为虚线dashed时，background背景色会嵌进去。）还有原来ie浏览器还不兼容！
2017-08-11 14:33:13
236
转载 排序小结
两路快排：function partion(arr, low, high){ var idx = low; var pivot = arr[low]; while(low<high){ while(low= pivot){ high--; } while(low<high && arr[low] <= pivot) { low++; } i
2017-08-11 14:14:59
191
转载 前端题部分总结
转载自：http://www.cnblogs.com/venoral/p/5325202.html这只是部分题，答案为个人观点如有错误欢迎指出，感觉考点都挺基础，但是很注重考细节方面，通过整理也知道自己在CSS3和HTML5，网络知识等方面的不足还是得多学多练多思考。css1.多选//HTML很长的一段文字，很长的一段文字，很长的一段文字，特别长的文字
2017-08-11 13:53:54
458
原创 Ajax.js工具函数
// ajax get 五部曲function ajax_get(url,data) { // 异步对象 var ajax = new XMLHttpRequest(); // url 方法 // 如果是get发送数据 发送的格式为 xxx.php?name=jack&age=18 // 所以 这里 需要拼接 url if (data) { // 如果有值 需要拼接字符串
2017-08-10 16:25:34
532
原创 JSON基础知识
1、调用 JSON 对象的 parse方法，可以将 json 格式的字符串转化为 对应的 js对象var str = '{"name":"jack","wife":"rose","friend":"iceMountain"}'; var jsObj = JSON.parse(str); console.log(jsObj); console.log(jsObj.name); con
2017-08-10 15:03:30
227
原创 发送Ajax请求
发送ajax需要五步：1、创建异步对象2、设置请求的url等参数3、发送请求4、注册事件5、在注册的事件中，获取返回的内容并修改页面的显示 // 绑定点击事件 document.querySelector('#btnAjax').onclick = function () { // 发送ajax 请求 需要 五步 // 1.创建异步对象 var ajax
2017-08-09 16:01:29
273
原创 PHP基本语法
在学了javascript的基础上学习PHP很容易，其实所有语言都一样，初恋C语言最麻烦，但学会了其他语言入门绝对容易。1、变量定义：$，且每次变量调用时都要带上2、for($i=0;$i3、拼接字符串方式：.(一个点) 例子：$i='晴朗'; echo('今天天气').$i;4、输出字符：echo ' '5、提醒浏览器汉字输出： header('content-ty
2017-08-08 17:46:13
180
原创 Sublime Text3工具使用盘点
1、新代码段点击新代码段，将会创建一个新文件，内容如下所示：如下所示，在content中加入需要快速输入的代码，在中输入快速打出这段代码的标志p_header，此后便可以通过p_header快速输出header('content-type:text/html;charset=utf-8');保存的文件建议存放在一个文件夹中，方便以后调用。
2017-08-08 17:04:39
297
原创 WampServer可以访问IP，但无法访问localhost
在安装WampServer之后，并正常显示成绿色后，发现输入http://localhost:8088/ 无法访问，但是输入http://127.0.0.1:8088/ 可以正常访问。（PS：在httpd.conf文件中，我将端口号改为8088，以防和其他端口产生冲突）为了解决输入http://localhost:8088/ 无法访问的问题，先在httpd.conf文件中查找 “De
2017-08-08 14:03:56
6645
转载 浅析HTML5的10大优势
摘要：你难道还没有考虑使用HTML5？ 当然我猜想你可能有自己的原因；它现在还没有被广泛的支持，在IE中不好使，或者你就是喜欢写比较严格的XHTML代码。 你难道还没有考虑使用HTML5？ 当然我猜想你可能有自己的原因；它现在还没有被广泛的支持，在IE中不好使，或者你就是喜欢写比较严格的XHTML代码。HTML5是web开发世界的一次重大的改变，事实上不管你是否喜欢，它都是代表着未来
2017-08-05 14:14:12
2206
原创 居中方式
1、已经知道块元素的宽高，绝对定位.element { width: 600px; height: 400px; position: absolute; left: 50%; top: 50%; margin-top: -200px; /* 高度的一半 */ margin-left: -300px; /* 宽度的一半 */}2、Css
2017-08-01 14:26:42
992
转载 Position属性四个值
1、static（静态定位）：默认值。没有定位，元素出现在正常的流中（忽略top, bottom, left, right 或者z-index 声明）。 2、fixed（固定定位）：生成绝对定位的元素，相对于浏览器窗口进行定位。元素的位置通过 "left", "top", "right" 以及 "bottom"属性进行规定。可通过z-index进行层次分级。 3、r
2017-08-01 14:16:44
830
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人