Renkx0404-CSDN博客

原创 js之事件

事件的三要素：事件源事件名事件行为、在原生的js中事件分为0 级事件绑定和2级事件绑定，下面想说说0级的事件绑定 <p onclick=" alert(1)" style="cursor: pointer;">点击我</p>   &l

2018-12-08 19:29:05 189

原创 vue 路由之vuex

vuex是什么?主要是应用于vue.js中的管理数据状态的一个库。通过创建集中的一个数据存储，共程序中所有的组件访问根组件组件1（props）组件2（event）组件详情（props）添加组件（event）普通组件之间的传值，父组件向子组件传值的是props属性传值，而子组件向父组件传值的主要的...

2018-12-08 16:34:52 563

原创 vue之事件

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">

2018-12-01 18:58:46 463

原创 vue之实例化

vue实例化的属性<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"

2018-12-01 17:28:16 401

原创 vue之路由

路由的过程首先把路由模块安装到node_module当中 $ npm install vue-router --save安装好后就是把引入路由模块然后使用路由接下来就是配置路由展示路由路由过程解析安装路由模块很简单直接 $ npm install vue-router --save 2.安装好路由后，这边有两种配置理由的方式，一种是在main.js中配置路由，另一种是重...

2018-11-21 16:46:31 154

原创 vue之传值

vue中传值的类型- 父组件向子组件传值（属性传值）- 子组件向父组件传值（事件传值）属性传值过程假设有这样一个数据在许多的组件中都被使用，那么我们可以把这个数据放到根组件中，以属性传值的方式传递给子组件。首先在App.vue组件中定义一个公共的数据(实际项目中这个数据是异步获取的)publicData，我们可以分析，传值的过程就是把数据抛出的过程和接受的过程，这里是父组件向子组件传...

2018-11-21 11:25:55 215

原创 vue之组件

组件可以理解为具有某些功能的页面；组件的嵌套在components文件夹中创建一个组件（eg：Users.vue）;在根组件App.vue中引入、注册、显示组件； //引入组件 import Users from './components/Users' //注册组件(注册组件有两种方式一种是全局注册组件，另一种是局部注册组件<常用>) ...

2018-11-21 09:58:14 199

原创 vue之src文件流程及根组件APP

初始vue-cli中src文件的组成assets文件夹放一些对应的图片component文件夹组件文件夹App.vue文件根组件组件包含三个部分： - 第一部分：模板 html结构(有且只有一个根模板）； - 第二部分：行为 js 处理逻辑 - 第三部分：样式 css 解决样式main.js文件和index....

2018-11-19 14:46:11 340

原创 vue之脚手架

脚手架的优势脚手架是通过webpack搭建的开发环境使用的是es6语法打包和压缩js为一个文件夹项目文件在环境中编译而不是在浏览器中编译实现页面的自动刷新怎么样搭建脚手架#全局安装vue-cli $ npm il -g vue-cli#创建一个基于webpack模板的新项目 $ npm init webpack my-project#然后安装依赖, $...

2018-11-19 09:15:17 299

原创 js之闭包

闭包定义闭包就是能够读取其他函数内部变量的函数； *闭包是指有权访问另一个函数作用域中变量的函数。创建一个闭包的最常见的方法就是在一个函数内部创建另一个函数，通过另一个函数访问这个函数的局部变量，利用可以突破作用域链*。闭包的特性 - 函数内部嵌套函数 - 内部函数可以引用外部函数的参数和变量 - 参数和变量不会被垃圾回收机制收回闭包的优缺点...

2018-10-25 12:19:05 190 1

原创遍历的几种方法；

// // 1. 普通的循环let arr = ['apple','banane','pear','tomato']; for (let i=0;i<arr.length;i++){ console.log(arr[i]); };// 2.代替for；arr.forEach(functio...

2018-03-29 13:23:30 912

原创 angular学习之ng-bloak 解决闪屏问题；

<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title&g

2018-03-20 11:29:38 870

原创 angular 基础学习之初识

库和框架的区别？预先定义好的，帮忙省事的；库：人在用库； {出发点是方便程序员} 框架：框架在用人； {出发点限制程序员}AngularJs 1：避免重复劳动获取事件创建、接管UI；2：好在哪里：自动同步，节约精力；Angular学习：MVC：数据和表现的分离；（数据交互的模型）M：model 模型-数据 V：view 视图表现...

2018-03-20 11:10:36 273

原创自定义alert样式

jQuery('.ufo-register').click(function () { if(sta==false){ jQuery('.message').append(''); jQuery('.message').html('<img src="<{$res_url}>/images/infonotice.gif" alt="">'+'请阅读并同意会员注册

2017-11-30 16:33:01 424

原创滑动的验证码

<head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" href="css/jquery.slider.css" /> <script src="js/jquery-1.10.2.js"></script> <script src="js/jquery.slider.min.js

2017-11-30 16:28:09 655

原创动态获取屏幕的宽度

//获取屏幕的分辨率 var iwidth=window.screen.availWidth; // alert(iwidth) //动态的获取滚动条的宽度（不同的电脑的分辨率不同，其对应的滚动条的宽度也是不同的，这边可以动态获取滚动条的宽度） function getScrollWidth() {

2017-10-17 16:08:11 903

原创一行文字居中多行文字左对齐

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><style> /*当文字为一行是，则P的宽度小于div的宽度，p标签居中显示在盒子内，文字也就居中了 ;当大于一行时，P的宽度和div的宽度是一致的 ,文字就居左对齐了*/ .cont

2017-10-12 18:41:29 1344

转载 js

//事件捕获 function fun(ele,eve,handler,type){ if(ele.attachEvent){ ele.attachEvent("on"+eve,handler) }else{ ele.addEventListener(eve,handler,type) }

2017-09-05 11:02:44 245

原创 jQuery基础知识。

jQuery的概念： jquery是一个JavaScript库极大的简化了javascript的编程。其拥有强大的选择器支持，不仅支持css中选择器。同时也拥有其独特的选择器，同时也解决了各种浏览器的兼容问题。 jquery语法：$(selector).action()选择符selector是查询和查找HTML元素。 jQuery中action（）执行元素的操作。- 美元符号定义jquery

2017-08-20 15:08:12 298

原创 ajax

Ajax简介 Ajax = Asynchromons JavaScript and XML(即异步的javaScript 和XML)，可以通过后台服务器数据交换是页面更新。用法: 主要有四个步骤： 1:创建XMLHttpRequest对象；语法： var xml= New XMLHttpRequest(); //由于IE5和IE6版本没有这个对

2017-08-18 20:37:39 277

原创数组中的查重，排序等方法

数组查重：利用indexOf（）方法，indexOf 能返回元素在数组中的位置，如果没有返回-1； <script> function fn(arr) { var result = []; for (var i = 0; i < arr.length - 1; i++) {

2017-08-18 16:50:31 983

原创两倍屏和三倍屏中的1px处理方法

在做移动端页面时会面临一个问题，就是两倍屏和三倍屏问题，例如在iPhone6中就是两倍屏在iPhone6 plus中就是三倍屏，在手机页面中1px的线条会呈现2px和3px的效果，这样给用户的体验是非常不好的，所以需要解决这个问题，当然在移动端中border的1px问题还没有好的方法，所以要尽量避免border，这里讲的用伪类做1px线条；这里为了视觉效果我用的是10px；思路：首先随意准备一

2017-07-25 20:24:18 4751

原创 IE盒模型和w3c盒模型的区别

盒模型：盒模型包括内容（content），填充(padding内边距），边框（border），边框（margin外边距）。 w3c标准的盒子在页面上的宽度=左边距+左边框+内边距+内容width+右边距+右边框；下面右两个图片来解释w3c 盒模型和IE盒模型： IE盒模型的盒模型内容包括了padding和border；而w3c盒模型则不包括padding和border。也就是说虽然他

2017-07-25 19:45:06 1443

转载 display有哪些属性值

display的属性值有：none:缺省值，像行内元素一样显示。block:块元素，默认为父元素的高度，可以设置宽高，换行显示。inline:行内元素显示，默认宽高为内容的宽高，不能设置宽高，同行显示。inline-block:默认宽高为内容的宽高。可以设置宽高，同行显示。list-item:像块元素一样显示，并添加样式列表标记table: 此元素会作为块级表格来显示。inherit

2017-07-25 11:13:11 3301

原创 jquery方法1

jquery 样式的添加<p> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nisi soluta minima dicta molestias, delectus, quae quasi, porro minus nostrum, assumenda voluptas reiciendis eligendi v

2017-07-24 21:59:55 257

原创走入jquery的世界

jquery的概念： jquery是一个JavaScript库极大的简化了JavaScript的编程。其拥有强大的选择器支持，不仅支持css中选择器。同时也拥有其独特的选择器，同时也解决了各种浏览器的兼容问题。jquery 选择器： a:基础选择器， b:层级选择器， c:属性选择器， d：伪类选择器；基本的基础选择器有：id选择器 ————–$(‘#i

2017-07-19 20:10:03 396

原创 ajax 数据交互

首先我们先分装一个ajax 以方便下面使用。function ajax(option){ var type=option.type; var url=option.url; var async=option.async; var success=option.success; var xml = null; if(window.XMLHttpRequest){ xm

2017-06-29 20:13:39 482

原创冒泡事件、默认事件、事件委托、事件监听和事件捕获

知识点： 1. 冒泡事件； 2. 默认事件； 3. 事件的委托； 4. 事件捕获；冒泡事件：个人理解，以点击事件为例说明，在父子元素中都有点击事件，当仅获取子元素的点击事件时，这时父元素的点击事件也会发生，这种情况是在js中不想要的，所以我们要阻止冒泡事件。函数效果： 1：点击子元素是父子元素同时出现的效果。 2：阻止父元素的事件效果。函数思路： 1：构

2017-06-27 20:42:10 679

原创 js事件

onclick事件；onmousemove事件；onkeydown事件；事件实例： onclick事件：函数效果：在window窗口上随意点击获取x y的值；函数思路: 1:思路很简单就是一个点击事件，然后获相应xy值，但是有一点需要注意的就是兼容问题；知识点： 1：event.clientX，获取window中x轴上的值； 2：event.clientY，获取windo

2017-06-27 19:01:50 373

原创 js元素节点之其他节点

知识点： 1. 父节点： parentNode 和 offsetParent； 2. 兄弟节点：ElementSibling 和 Sibling； 3. 创建节点： createDocumentFragment() //创建一个DOM片段； createElement() //创建一个具体的元素；

2017-06-24 14:31:25 404

原创 js中元素节点

相关知识点： 1.nodeType: 节点类型； a：元素节点（1）； b：文本节点（3）； c：属性节点； 2. childNodes：返回所有的子节点，包括文本节点和元素节点， 3. children：是所有的子标签节点；。 4. firstChild：等同于node.childnodes[0]； 5. lastChild：等同于node.childnodes[nod

2017-06-24 09:19:37 421

原创函数的分装

1相关知识点：string1.indexOf(string2)；获取string2在string1中的索引值。当string2在string1中找不到时，值为-1<script> var str="abcdefghijklmno" var ostr=str.indexOf('fg'); alert(ostr);**//5**</script>首先新建一个html文件，如下：<!DOCT

2017-06-23 20:45:30 1385

原创 js 中getAttribute和setAttribute属性

知识点：getAttribute ：获取标签属性；setAttribute ：设置标签属性；用法实例： <html lang="en"> <head> <meta charset="UTF-8" /> <title>Document</title> </head> <body>

2017-06-23 19:29:06 1022

原创一个函数作为另一个函数的参数

函数的作为变量分装到另一函数里面<script>function checkeout(start,end,check){ for (var i =start; i<end; i++) { if(check(i)){ document.write(i+"<br>") } }}function check(x){ if (x%3==0) { retu

2017-06-23 18:05:45 921

原创居中的五种方式

居中的方式：首先我们新建一个html文件，如下；<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" /> <title>Document</title> <style> .box{ height: 100px; width: 100px; background: #C6

2017-06-22 18:29:32 490

原创 js基础

js 的运行环境：1. html-body中，2. 在外部的test.js文件中，3. 在控制台console中。js中的注释符:1. // 单行注释2. /**/ 多行注释3. ,多行注释注意：在sublime中可以用ctrl+/来注释，如果是很打段文字可以用ctrl+shift+/ 来注释；声明变量：var 是声明一个变量 var a=5； var

2017-06-22 16:43:37 318 1

原创隔行变色

用三种方法添加各行变色用css3中的nth-child（）伪类添加颜色；用原声js隔行添加颜色；用jquery隔行添加颜色；首先用到了jquery就需要搭建jquery框架<script type="text/javascript" src="js/jquery-1.11.3.js"></script><!DOCTYPE html><html lang="en"><head> <me

2017-06-21 18:45:40 365

原创第一次搭建vue 环境

首先来说vue的作者是中国人，叫尤雨溪。vus.js官网这里面有详细的介绍；我写这个的目的是记住这些知识点，如果有人误踩坑可以点击官网看看也是一种收获。首先来说vue的引入方式：第一种是直接在本地html中引入<script src="https://unpkg.com/vue/dist/vue.js"></script>这里我是将 https://unpkg.com/vue/dist/v

2017-06-20 20:50:26 569

原创三角形制作原理

<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>The triangulation principle</title> <style> .triangle{ width: 0;

2017-06-20 17:57:12 517

原创 git 初次接触需要知道的代码

git –version :查看git当前的版本；如果出现当前版本也说明git安装成功。 cd +文件夹名 :进入文件夹； cd desktop是进入桌面，桌面也会一个文件加，如下图。 ls : 显示文件夹里的内容； cd ../ :返回上一级文件夹；git init : 初始化一个版本，首先在desktop上新建

2017-06-17 12:26:45 417

空空如也

空空如也