tracy-迪-优快云博客

原创前端面试题1

HTML CSS 1.1 行内元素，块级元素，行内块计元素有哪些？相互之间怎样转换？行内元素：<span>、 < img> 、<a> 、<input> 、<selecet> 、<i> <textarea> 块级元素： <div> <ul> <ol> <li>...

2020-02-05 17:53:26 374

原创 jQuery

jQuery 是一个高效、精简并且功能丰富的 JavaScript 工具库。它提供的 API 易于使用且兼容众多浏览器，这让诸如 HTML 文档遍历和操作、事件处理、动画和 Ajax 操作更加简单。 1、三种类似于js中window.onload的三种写法 $(document).ready(function () { console.log(1); }); $(f...

2019-07-22 22:14:46 168

原创 canvas绘图

首先，设置canvas画布大小canvas.width = 1200; canvas.height = 400; 将canvas转化为2d模型 getContextvar content = canvas.getContext("2d"); 1、绘制矩形 content.fillStyle = "red"; content.fillRect(0, 0, 300, 200); co...

2019-07-07 08:51:34 186

原创设计模式

js里面的设计模式 1、工厂模式 —最终返回一个对象 function work(name, sex) { //函数里面封装对象返回对象 var obj = new Object(); //设置相关属性 obj.name = name; obj.sex = sex; obj.sleep = fu...

2019-06-30 11:28:20 154

原创 js继承

继承：子类继承父类声明一个父类：属性和行为声明一个子类对象面向对象有三大特征：封装继承多态 1、原型链继承（核心：将父类的实例作为子类的原型）优点：非常纯粹的继承关系，实例是子类的实例，也是父类的实例父类新增原型方法/原型属性，子类都能访问到，简单，易于实现缺点：要想为子类新增属性和方法，必须要在new Animal()这样的语句之后执行，不能放到构造器中无法实现多继...

2019-06-30 11:21:59 126

原创跨域

跨域：协议端口主机名称不同会产生跨域跨域分为两种： 1、通过jsonp跨域（src跨域） jsonp的原理，通过script标签引入一个js文件，这个js文件载入成功后会执行我们在url参数中指定的函数，并且会把我们需要的json数据作为参数传入。所以jsonp是需要服务器端的页面进行相应的配合的。 2、 cross 跨域：php 在里面配置 header('Access-...

2019-06-21 16:09:11 167

一、XMLHttpRequest对象：用于在后台与服务器交换数据。二、XMLHttpRequest对象的方法： 1、abort() 停止当前请求 2、getAllResponseHeaders() 把HTTP请求的所有响应首部作为键/值对返回 3、getResponseHeader(“header”) 返回指定首部的串值 4、open(“method”,“URL”,[asyncFlag],[“u...

2019-06-20 09:45:46 746

原创多级联动

思路 1、画页面 2、写脚本（1）获取全部数据；（2）input文本框里显示省：使用Option获取省，appendChild（）追加在页面上；（3）添加input文本框发生变化事件，使选择之后下面的框里显示下一级的name名称； ①在大数据里拿出省的集合存到一个空的集合里（arraylist）； ②遍历arraylist，遍历，每次取最后一位的子集追加在下面的框里； ③点击下面框里的名称，...

2019-06-14 22:51:36 425

原创正则表达式

正则表达式：验证数据的格式两种验证方法 match() 验证成功！返回的是值验证失败返回的是null —字符串用法 test() 验证成功！ true 验证失败 false —正则对象的用法 var str = "18789469941"; str.match()//括号里面是正则表达式 /*声明正则对象*/ var reg = new RegExp()...

2019-06-14 22:31:08 176

原创城市选择多级联动

<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>自动选择三级联动</title> <style> * { margin: 0; padd...

2019-06-13 21:39:43 466

原创原生js--钟表

<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>钟表</title> <style> .block{ margin: auto; wid...

2019-05-12 21:22:22 236

原创原生js--倒计时

<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>倒计时</title> <style> .block{ margin:auto; tex...

2019-05-12 09:57:34 320

原创原生js--图片的瀑布流

<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>图片瀑布流1</title> <style> *{ margin:0; padding:...

2019-05-11 19:21:25 144

原创原生js--验证码

<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>验证码</title> <style> .block{ margin:auto; wid...

2019-05-11 19:19:25 188

Tracy_di的博客