2018年06月_洛神赋在csdn

原创数据冻结Object.freeze冻结的时机

<html><head> <script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script></head><body> <p id='node'> {{place}} &l

2018-06-30 10:03:44 3408

原创 script位置影响执行时机以及script的执行和DOM加载之间的微妙关系

调试过程中的思考：==================================================================DOM的加载和script执行之间的关系:先执行script代码，再加载DOM。在执行document.getElementsByTagName('div');时，还没有加载div元素所以获取不到div元素。=====================...

2018-06-29 08:40:38 934

原创节点的关系和操作

节点之间的关系每一个节点都有childNodes属性，这个属性明显体现了父子关系。从父到子。每一个节点都有parentNode属性，这个属性也体现了父子关系。从子到父。同一个父节点的nodeList中的每一个节点都有previousSibling属性和nextSibling属性，即便是第一个和最后一个，结果无非就是空与非空。这明显体现了兄弟关系。通过以上的由父到子和由子到父以及兄弟之间的关系，我们...

2018-06-26 08:18:19 704

原创后台表单字段不校验导致前台的困惑

前台传递的参数字段名称和后台不一样，后台没有报错，返回的结果是NULL。后台为什么能够接受？首先我们定义的参数对象是object类型pageParam: { currentPage: 1, pageSize: 5, partCode: null, partName: null, dealerId: null, partCataloId: null}后台接受的数据类型都是Object类型。至于这个参...

2018-06-21 14:33:16 495

原创 JavaScript中的window对象

<html><head> <script type="text/javascript"> //确认浏览器的位置 var left = (typeof window.screenLeft == 'number') ? window.screenLeft : window.screenX; var top = (ty...

2018-06-21 08:15:28 205

原创 JavaScript中的窗口关系和框架

浏览器的全局对象是window,在全局作用域中声明的对象实际上都是都是挂载在window对象下。页面中如果包含多个框架，那么每一个框架都有自己的window对象。也就是每一个框架都有自己的全局作用对象。所有的框架都保存在frames集合上。每一个框架可以通过框架名访问，window.frames[framename];搜索frame的方法还是两种方式，绝对搜索和相对搜索。绝对搜索也就是针对最顶层的...

2018-06-21 07:18:48 1170

原创 JavaScript中的私有变量

JavaScript中的私有变量很不好意思。Javascript中没有私有变量这一事实。JavaScript中的所有对象属性都是公有的。我们在任何地方，可以通过对象加成员访问符就可以访问我们的成员变量。虽然实际上没有私有变量，但是我们可以提出一个私有变量的概念。什么是私有变量？只能在函数内部，不可以在函数外部访问的变量。那么，这就引出一个事实：在函数内部定义的变量在函数外部都是不可以访问的。因此，...

2018-06-20 08:41:32 1098

原创 BootStrap中的HelloWorld

<html><head> <meta charset="utf-8">   <meta name="viewport" content

2018-06-19 22:28:21 239

原创 JavaScript闭包

纯粹个人笔记不适合新手看，因为经过提炼。在JavaScript中闭包是个纠结。需要理解，但是尽量避免使用。因为在功力不够的情况下，驾驭不了神功，容易走火入门。理解闭包的核心是理解如何创建作用域链以及作用域链有什么作用的细节。一个函数被执行时，首先创建这个函数的执行环境和相应的作用域链。然后使用参数来初始化活动对象。一个函数包含本地的活动对象和全局变量对象。在函数中访问一个变量时，首先在当前作用域中...

2018-06-19 08:28:29 125

原创 vue中select实现单选

<html><head> <script src='js/vue.js'></script></head><body> <div id="example"> <select v-model='city'> <option value='西安'&am

2018-06-18 16:53:04 1635

原创 vue中使用select实现多选

<html><head> <script src='js/vue.js'></script></head><body> <div id="example"> <select v-model='workplaces' multiple> <optio

2018-06-18 16:50:15 21443 10

原创 vue中使用select元素实现单选radio的功能

<html><head> <script src='js/vue.js'></script></head><body> <div id="example"> <select v-model='city'> <option value='西安'&am

2018-06-18 16:17:00 2097

原创 Vue中的radio的使用方法

<html><head> <script src='js/vue.js'></script></head><body> <div id="example"> <input type='radio' id='wuhan' value='武汉' v-model='city'/&amp

2018-06-18 16:00:28 35810 4

原创 vue中checkbox组的使用

<html><head> <script src='js/vue.js'></script></head><body> <div id="example"> <input type='checkbox' id='china' value='china' v-model='coun

2018-06-18 15:20:05 5712

原创计算属性

在模板中当一个属性的值依赖另一个属性时，采用计算属性。<html><head> <script src='js/vue.js'></script></head><body> <div id="example"> <input type='text' v-model='basePr

2018-06-18 14:55:05 1638

原创 JavaScript中的继承下篇

//经典继承 function SuperType() { this.words = "凛冬将至"; } SuperType.prototype.place = '风息堡'; function SubType() { SuperType.call(this); //在子对象内部调用父对象的构造函数 //获取父对象属性的副本，注意是副本。 ...

2018-06-17 22:29:14 128

原创 JavaScript继承上篇

function Animal() { this.hour = 7; this.sleep = function() { console.log("animal need to sleep " + this.hour + " hours!"); } } Animal.prototype.feelings = ['puzzed', 'sad', 'respect', 'an...

2018-06-17 21:02:05 107

原创 JavaScript从工厂模式到寄生对象模式

工厂模式：function personFactory(username, password) { var person = new Object(); person.username = username; person.password = password; return person;}var person = personFactory("luohao", "123456");conso...

2018-06-17 12:37:04 315

原创 JavaScript创建自定义类型的方法以及改进措施

采用构造函数存储实例属性，采用原型模式存储公共属性。这就是实际中最常用的创建自定义类型的最佳实践。function Person(username, password){ this.username = username; this.password = password;};Person.prototype = { constructor: Person, places: ['希腊', '罗马'...

2018-06-17 12:14:21 197

原创 JavaScript原型模式下篇

<html><head> <script type="text/javascript"> function Person(){ }; Person.prototype = { constructor: Person, username: "logic", password: "12345", places: ['西安', '武汉', '成都..

2018-06-17 10:29:26 130

原创 JavaScript原型模式中篇

原型的动态性什么叫原型的动态性？对原型对象的修改会作用于实例，即便实例是在原型对象修改前创建的。举一个例子:function Person() {};Person.prototype.username = 'luohao';Person.prototype.password = '123456';Person.prototype.register = function() { console.lo...

2018-06-17 09:47:55 130

原创如何实现v-for循环出来的列表里面的click事件只对当前列表内的元素有效

<!DOCTYPE html><html><head> <script type="text/javascript" src="js/vue.js"></script></head><body> <div id="app">

2018-06-16 21:00:57 9461

原创 v-model双向数据绑定

<!DOCTYPE html><html><head> <script src="js/vue.js"></script></head><body id="example"> <form> 姓名： <input type=&quo

2018-06-16 16:36:00 192

原创 v-if 和 v-else

v-else必须要和v-if匹配使用，v-else不能单独使用。只有v-if的值为false时，v-else模块才会显示出来。<!DOCTYPE html><html><head> <script src="js/vue.js"></script></head><body> <di

2018-06-16 15:52:35 19798 1

原创 v-if 和 v-show的比较

v-if指令根据表达式的值动态地插入或者移除DOM元素<!DOCTYPE html><html><head> <script src="js/vue.js"></script></head><body class="native"> <div id="

2018-06-16 15:36:51 157

原创 JavaScript原型模式上篇

原型模式上一次讲到了构造函数模式，遗留了一个问题：如果同一个方法被多个实例对象使用，那么创建的多个实例中都存在相同的方法，而其实这个方法完全可以作为公共的方法被某个类的所有实例对象共享。为此，我们创建了全局方法。随之而来的问题是，如果这个方法是全局方法，那么岂不是所有的对象都可以方法这个方法了吗？这有损封装的特性。最好是由具体的某一类对象使用这个方法，或者这个方法是专门为这一类实例对象准备的。还有...

2018-06-16 10:21:47 149

原创 JavaScript中工厂模式和构造函数模式

========设计模式===========第一个设计模式：工厂模式。一般我们是通过Object和工厂模式的方式创建对象。现实中这种方式使用的也是最多的。但是做事要追求高大上。这是一种信仰。学会在实际中尽量使用设计模式。比如创建一个Person实例。var person = new Object();person.name = "希斯克利夫";person.theme = "呼啸山庄";cons...

2018-06-15 09:58:46 225

原创对JavaScript对象的理解上篇

什么是对象？对象和散列表在结构上很是相似都是键值对的集合。对象的创建方法传统的方法是使用new Object()方式。然后，在程序的执行过程中，动态地为其添加相关的静态属性和动态属性。var obj = new Object();obj.words="凡人皆有一死";obj.house="风息堡";obj.future = function() {}另一种就是采用字面量的方式：var obj = ...

2018-06-14 08:34:15 174

原创 JavaScript中的基本包装类型和引用类型

String s1 = "wuhan";s2 = s1.substring(2);console.log(s2);以上代码竟然可以执行！s1是基本字符串类型，基本类型是没有属性和方法的，但是s1存在substring方法，这不就矛盾嘛。这里涉及到一个自动类型转换的问题，在后台解析器自动将基本类型转换成基本包装类型基本包装类型，而且是隐形的基本包装类型。显示的基本包装类型是引用类型(new)。基本包...

2018-06-13 08:11:19 298

原创 vue双向数据绑定

如果数据不是双向数据绑定而是单向数据绑定，那会怎么？而且这种单向是从模型到视图的单向。因此，当你更改了数据时，必须操作dom元素更新与之绑定的页数数据显示。但是，有了双向数据绑定后，就省略了手动更新数据这一步。你可以想一想双向数据绑定基于的技术是什么。不用任何想象力，你就应该猜得到那就是监听啊，监听啊，监听啊！<html><head><script type="tex...

2018-06-12 20:55:12 187

原创 Vue入门 --- HelloWorld

<html><head><script type="text/javascript" src="js/vue.js"></script><script type="text/javascript"> new Vue({ el: '#app', data: { message: 'Hello World!

2018-06-12 20:19:40 1122

原创 JavaScript中的函数上篇

==========================function==========================第一点：函数是对象，函数是对象，函数是对象。重要的话说三遍。函数既然是对象，那么函数自然有引用啊，既然有引用，那肯定可以不止只有一个引用啊。看一段代码：var point1 = function() { console.log("function test");}var poin...

2018-06-11 22:32:46 125

原创 JavaScript中的正则表达式RegExp

正则表达式的两种表示方法：字面量形式和构造函数形式var reg = /cat/g;var reg = new RegExp("/cat/", "g");可见无论哪一种方式都指明了正则表达式都由两部分组成：模式和标志。标志分三种：g(global),i(ignore),m(multiline)。global:匹配所有符合条件的字符串而不是遇到第一个解就终止。ignore：忽略大小写multilin...

2018-06-11 21:35:12 144

原创 JavaScript中的Array下篇

左迁至蓝关示侄孙湘一封朝奏九重天，夕贬潮阳路八千。欲为圣明除弊事，肯将衰朽惜残年！云横秦岭家何在？雪拥蓝关马不前。知汝远来应有意，好收吾骨瘴江边。数组复制和数组拼接var cities = ["wuhan", "beijing", "suhzou", "jiangxi"];数组复制places = cities.concat();console.log(cities.join("||"));数组拼...

2018-06-10 19:35:32 105

原创 JavaScript中的Array 上篇

JavaScript中的数组和Java中的数组之间的差异1 => Java中的数组的每一项存储的数值的类型必须完全一样，但是JS灵活很多，JS中的数组的每一项存储的元素的类型都可以不一样。2 => Java中的数组的容量是在定义时就初始化好的，不存在扩容的可能性。但是JavaScript中完全不一样，JavaScript中的数组是可以动态扩容的。归结为两点：类型多样化和容量自增化。数组...

2018-06-10 11:29:10 156

原创 JavaScript基本类型和引用类型

============================基本类型和引用类型=================================基本类型有哪些？Undefined, Null, Number, Boolean, String基本类型在内存中占据固定内存大小的空间，保存在栈空间上。对基本类型的复制是的的确确的复制，复制的是基本变量自身，得到的是一个副本。判断某个值是哪种基本类型，可以使用...

2018-06-09 09:17:47 361 1

洛神赋