- 博客(28)
- 收藏
- 关注
原创 react基础1(导入组件,绑定属性,引入图片,react双向绑定)注明:vue中使用ref调用时写法为this.$refs,而react中调用时为this.refs
1、组件的写法组件的写法1.import React from ‘react’;2.声明当前组件的类class Rindex extends React.Component{}3.暴露出去 export default name;4.写类里面render 渲染方法render(){return (标签)多个标签??? 单个标签}5.在组件里面声明constructor ...
2019-08-01 16:43:37 631
原创 Vue基础1(vue目录结构,数据、属性绑定,循环(v-for)渲染数据,vue数据双向,vue事件,vue中ref获取dom元素节点)
vue 项目中目录结构 vue的数据绑定 绑定属性 循环渲染数据 数据渲染<template> <div id="app"> <div>我的第一个vue</div> <div>注意下边的代码都是在data对象中取值</div> <!--变量的动态绑定-->...
2019-07-25 16:44:18 433
原创 jQuery基础3(操作dom元素的属性和方法)
注意:jquery可以进行隐式迭代 操作一堆以该页面为例:<button class="btn">按钮1</button><button class="btn">按钮2</button><button class="btn">按钮3</button><button class="btn">按钮4<...
2019-07-22 18:34:01 371
原创 jQuery基础2(过滤)
以该页面为例:<body><ul><li>1</li><li>2</li><li class="liinfo">3</li><li>4</li><li>5</li><li>6</li></ul><...
2019-07-22 17:36:16 240
原创 jquery基础1(创建dom,元素的包裹,replace,清空,克隆)
PS:window.onload在jquery中类似于:$(document).ready(function(){ console.log(1);})jquery中方法:$(function () { console.log(2); }); jQuery(function (){ console.log(2); });...
2019-07-22 17:05:58 386
原创 jQuery常用工具(each遍历,extend追加继承封装以及合并(注意fn.extend),grep过滤函数,makearray类数组对象转化为数组,$map映射,查询数组($.inarray))
以ui>li为例子<ul> <li>1</li> <li>2</li> <li>3</li> <li>4</li></ul>1、用于遍历对象或者集合$.each(obj,callback); var a = [1, 2, 3, 4...
2019-07-21 16:47:07 241
原创 JS中的继承
JS继承的实现方式既然要实现继承,那么首先我们得有一个父类,代码如下:// 定义一个动物类function Animal (name) { // 属性 this.name = name || 'Animal'; // 实例方法 this.sleep = function(){ console.log(this.name + '正在睡觉!'); }}// 原型方...
2019-06-30 19:21:22 278
原创 JS设计模式——优化开发模式
第一种:工厂模式function work(name, sex) { //函数里面封装对象 返回对象 var obj = new Object(); //设置相关属性 obj.name = name; obj.sex = sex; obj.sleep = function () { ...
2019-06-30 19:16:39 289
原创 JS贪吃蛇
源码如下:<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <meta > <title></title> <style> .map { positio...
2019-06-30 19:11:12 133
原创 JS小游戏———flappybird
JS代码如下:/**Created by ASUS on 2019/6/24.*///创建地图var Map;function map() {this.map=null;this.createMap=function () {if(this.map == null){this.map = document.createElement(“div”);this.map.cl...
2019-06-30 19:08:56 261
原创 何为浏览器的同源策略以及跨域的常用方式
浏览器的同源策略:何为同源?只有当协议、端口、和域名都相同的页面,则两个页面具有相同的源。只要网站的 协议名protocol、 主机host、 端口号port 这三个中的任意一个不同,网站间的数据请求与传输便构成了跨域调用,会受到同源策略的限制。 同源策略限制从一个源加载的文档或脚本如何与来自另一个源的资源进行交互。这是一个用于隔离潜在恶意文件的关键的安全机制。浏览器的同源策略,出于防范跨...
2019-06-22 01:02:47 235
转载 常用的正则表达式
/* * 正则表达式 : 验证数据的格式 * 正则如何验证 * match() 验证成功! 返回的是值 验证失败 返回的是null ---字符串用法 * test() 验证成功! true 验证失败 false ---正则对象的用法 * */ var str = "18789469941"; ...
2019-06-12 22:07:37 275
原创 HTML加入音频
可以通过使用 getElementById() 来访问 元素:var x = document.getElementById(“myAudio”);也可以通过使用 document.createElement() 方法来创建 元素:var x = document.createElement(“AUDIO”);...
2019-06-12 21:39:38 765
原创 new Option()函数,以及HTML DOM setAttribute() 方法
HTML DOM setAttribute() 方法实例:设置 input 元素的 type 属性:document.getElementsByTagName(“INPUT”)[0].setAttribute(“type”,“button”);<!DOCTYPE html><html><body><input value="OK">...
2019-06-12 21:32:02 1324
原创 JS四种计时器
计时器对象:setTiemout、setInterval、setImmediate、requestAnimationFrame。定时器:JS提供了一些原生方法来实现延时去执行某一段代码setTimeout: 设置一个定时器,在定时器到期后执行一次函数或代码段var timeoutId = window.setTimeout(func[, delay, param1, param2, …]);...
2019-06-06 15:43:26 24353
转载 JS事件
事件机制事件绑定首先要对 DOM 元素绑定事件处理函数。所谓事件处理函数,就是处理用户操作的函数,不同的操作对应不同的名称。事件绑定的办法:1.直接在HTML元素绑定,在标签后加onclick = function(){}等2.在js脚本中绑定,获取元素后绑定事件3.DOM绑定,添加事件监听第一种无法删除,不好维护第二种无法删除,维护性一般第三种可以删除,维护性一般在DOM中直...
2019-06-06 15:23:01 208
转载 DOM定义 DOM对象
HTML DOM 定义了访问和操作 HTML 文档的标准。HTML DOM Node Tree常用的DOM对象方法:getElementById() 返回带有指定 ID 的元素。getElementsByTagName() 返回包含带有指定标签名称的所有元素的节点列表(集合/节点数组)。getElementsByClassName() 返回包含带有指定类名的所有元素的节点列表。app...
2019-06-06 14:59:28 400
转载 DOM Event对象
已知比较重要的:targetHTML DOM Event 对象:Event 对象代表事件的状态,比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态。事件通常与函数结合使用,函数不会在事件发生前被执行!事件属性:onabort 图像的加载被中断。onblur 元素失去焦点。onchange 域的内容被改变。onclick 当用户点击某个对象时调用的事件句柄。ond...
2019-06-06 11:51:56 158
原创 JS中DOM元素的事件以及操作
dom的事件:js的事件前缀都带on* 键盘事件 表单事件 鼠标事件 浏览器事件 触屏事件。。。。*onkeydown(键盘按下) onkeyup(键盘抬起) onkeypress(按键事件)* onfocus(获得焦点) onblur(失去焦点)* onclick(单击) ondbclick onmouseleave(水平离开) onmouseout(离开) o...
2019-05-23 13:27:26 616
原创 JS里数组的常用方法
已学JS模块:js里面的变量 - 全局和局部变量 闭包 —变量也可以提前声明js里面的函数问题 自执行函数 匿名函数 参数的问题 返回值的问题 (有点函数可以提前声明 —常规函数)字符串的函数----substr substring indexof lastindexof replace search 。。。。 charAt St...
2019-05-23 13:23:27 233
原创 JS字符串常用方法
1、console.log(str.indexOf(“m”));indexOf(数组) 数组查询,找到了返回当前字符的索引位置 没找到直接返回-1console.log(str.lastindexof(“res”);和indexof一样的功能,不过是从后往前找遍历字符串,获取每个字符的索引位2、charAt(pos);根据索引获取相应的字符charCodeAt(index);...
2019-05-23 13:16:28 157
原创 初学JS(循环递归、闭包、字符串操作)
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title></head><body><!--js ecmaScript5.0 es5 原生js6.0 es6 ...
2019-05-16 12:38:10 639
原创 手机弹性盒子页面属性
flex 属性用于设置或检索弹性盒模型对象的子元素如何分配空间。flex 属性是 flex-grow、flex-shrink 和 flex-basis 属性的简写属性。flex-grow 一个数字,规定项目将相对于其他灵活的项目进行扩展的量。flex-shrink 一个数字,规定项目将相对于其他灵活的项目进行收缩的量。flex-basis 项目的长度。合法值:“auto”、“inherit...
2019-05-16 12:33:02 270
原创 CSS动画归类
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> /*2d 2d-3d animation 过渡*/ transform:...
2019-05-09 13:42:11 282
原创 css1
content伪类:定义和用法content 属性与 :before 及 :after 伪元素配合使用,来插入生成内容。说明该属性用于定义元素之前或之后放置的生成内容。默认地,这往往是行内内容,不过该内容创建的框类型可以用属性 display 控制。动画:@keyframes 规定动画。 animation 所有动画属性的简写属性,除了 animation-play-state 属性...
2019-05-09 13:34:44 157
原创 初学CSS
盒子内边框超过外边的盒子:1、使用overflow:hidden;2、在盒子样式中加入:height:100%;边框阴影:box-shadow:1px 2px 3px 4px #ccc inset; 来分别看一下以上六个值的含义: 1px 从原点开始,沿x轴正方向的长度(倘若为负值,为沿x轴负方向的长度);2px 从原点开始,沿y轴正方向的长度;(倘若为负值,为沿y轴负方向的...
2019-04-17 20:30:16 170
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人