遗漏知识点

input

  • 把input的外边框放在内部(这样input外边框不占用多余像素)标准盒子类型转ie盒子类型
box-sizing:border-box;
  • ie盒子转标准盒子
box-sizing: content-box;  //W3C盒子
  • 把input选中外边框去掉
outline:none;

textarea 固定样式

resize:none;

选中背景色改变

p::selection {
        background:yellow;
    }

css3 background-size

-webkit-background-size: ;
background-size: cover;
  • 可填参数:
    length:如100px 100px
    percentage:百分比,如90% 90%
    cover:按照较小边等比缩放目标大小
    contain:按照较大边等比放大目标大小

null 是特殊对象

  • 因为null是原型链的终结者

arr[0] 等价于 arr["0"];

var arr = [1,2,3,4];
arr.name = 'xi';
for(k in arr){
  console.log(k); //打印 0,1,2,3,name
}
console.log(arr.length); // 4

判断是否为空和数字

if( !num || typeof(num) !== "number"){
}

禁止默认事件

e.preventDefault();

阻止事件冒泡

e.stopPropagation();

jquery的入口函数

  • jquery (所有标签加载完毕就执行,DOM载入就绪,并且书写多个入口函数不影响)
  • $(document)意思是说,获取整个网页文档对象(类似的于window.document)
$(window).load();
$(document).ready();
  • js (等待所有文件加载完毕,书写多个入口函数只会执行最后一个入口函数)
window.onload = function (){}

json

  • json对象不可以存放function
  • 键值都需要加引号
  • 可以存放对象
  • JSON.stringify(); (转字符串时会自动删除对象里面的函数)
  • JSON.parse();

valueOf 方法

  • 对象-->字符串
  • String.valueOf(Object obj) : 将 obj 对象转换成 字符串, 等于 obj.toString()

event.target (事件委托会用到)

  • 和this相同,指向事件的调用者
openRequest.onsuccess = function(event){
        var db = this.result;
        // var db = event.target.result;
      }

字符串、数组方法 contains();

  • 判断数组内是否有相同值,返回布尔值

访问对象的方式

person.name;
person['name'];

this

var length = 10;
function fn(){
  console.log(this.length); // 10 这里没有调用者,是window在调用方法
}
var obj = {
  length: 20,
  method: function (fn){
    fn();
argments[0](); // 3 这里的等价于 arguments.fn()
  }
}
obj.method(fn,1,2);

字符串取第一个首字母

var first = words[0];
var first = charAt(0);
function cssToDom(cssStr){
  var words = cssStr.split("-");
  for(var i=1;i<words.length;i++){
    words[I] = words[I][0].toUperCase()+words.substr(1);
  }
  log(words.join(""));
}
cssToDom(border-type-nth);

事件冒泡

  • 事件冒泡最终到window
  • window下面是document
  • 阻止事件冒泡
event.cancelBubble = true;  //ie清除冒泡 现在也支持大部分流行浏览器
event.stopPropagation(); //不支持ie

w3c盒子和ie盒子的区别

  • W3c盒子模型和IE盒子模型&box-sizing属性
  • box-sizing 属性
  • content-box,border和padding不计算入width之内,也就是说,整个界面的宽度要是content+padding+border
  • padding-box,padding计算入width内也就是说,整个界面的宽度要是content+padding
  • border-box,border和padding计算入width之内,其实就是怪异模式了~也就是说,整个界面的宽度要是content的width

var

console.log(num); //undefined
      var num = 10;
      console.log(num); //10
      var num ;
      console.log(num); //10

以上代码,var num会变量提升,但是不会赋值,所以第一句打印语句打印undefined。然后执行赋值语句,所以在后面提升的num有了值10,所以之后打印的num的值为10.

取消a标签的默认事件

event.preventDefault();

js中的特殊数据类型

  • null
  • undefined

什么是原型链

  • JS原型对象和原型链
  • 想要知道 f1 是如何把 prototype 留给“后代”,我们需要了解一下 JS 中的原型链。此时,JS中的 proto 入场了,这哥们长的很奇特,隐藏的也很深,以致于你经常见不到它,但它在普通对象和函数对象中都存在, 它的作用就是引用父类的 prototype 对象,JS在通过 new 操作符创建一个对象的时候,通常会把父类的 prototype 赋值给新对象的proto属性,这样就形成了一代代传承...
function f(){}
f.prototype.foo = "abc";
var obj = new f();
console.log(obj.foo); //abc
  • 现在我们知道,obj中proto保存的是 f 的 prototype,那么 f 的 prototype 中的 proto 中保存的是什么呢?
  • f.prototype 的 proto 中保存的是 Object.prototype,Object.prototype 对象中也有 proto,而从输出结果看,Object.prototype.proto 是 null,表示 obj 对象原型链的终结。
  • 函数的 prototype 不属于自身的原型链,它是创建子类的核心,决定了子类的数据类型,是连接子类原型链的桥梁。

什么是闭包

  • 干货分享:让你分分钟学会JS闭包
  • 当一个内部函数被其外部函数之外的变量引用时,就形成了一个闭包。
  • 在 Javascript 中,如果一个对象不再被引用,那么这个对象就会被 GC 回收,否则这个对象一直会保存在内存中。
  • 当我们需要在模块中定义一些变量,并希望这些变量一直保存在内存中但又不会“污染”全局的变量时,就可以用闭包来定义这个模块。

事件的原理、如何传播

form 默认 method GET

<input type="hidden" name="a" value="login">
  • <form enctype = "multipart/form-data"> // 表单信息编码
  • form 文件上传method 必须写POST

序列加载表单数据

  • serialize()方法
表单对象.serialize();

$.ajax 中检测错误

error:function(XMLHttpRequest, textStatus, errorThrown){
            console.log("请求对象XMLHttpRequest: "+XMLHttpRequest);
            console.log("错误类型textStatus: "+textStatus);
            console.log("异常对象errorThrown: "+errorThrown);
          }

require 访问的文件是当前页面路径下的页面的路径

访问权限控制

  • public 是指外部可以直接访问的属性或者方法
  • protected 是指外部不可以直接访问的属性或者方法,子类可以访问
  • provate 只能自己内部使用的属性或者方法,包括子类也不能使用

php implode 方法

php 常见方法

  • 表单的数据处理
  • 转义函数 addslashes
  • 转实体字符函数 htmlentities(); htmlspecialchars 反转 htmlentitles_decode();
  • 富文本编辑器
  • trim() 清除空格

$__SERVER['REMOTE_ADDR'];

去除滚动条

::-webkit-scrollbar {
width: 0;
height: 0;
}
  • white-space: nowrap;/强制一行显示/

  • overflow: hidden;/超出部分隐藏/

  • text-overflow: ellipsis;/超出部分用省略号代替/

  • 三栏布局


    屏幕快照 2017-09-11 下午7.12.45.png
  • sort

  • 从大到小

arr.sort(function(v1,v2){
  return v2-v1;
})

label 和 input 绑定

<label for='username'>用户名:</label>
<input type='text' id='username'>

对象转字符串

  • valueOf 如果对象是封装对象(String、Boolean、Number)会转换成相应的字符串,然后toString();如果不是封装对象,调用valueOf变成[object Object] toString();
  • if({}) // true
  • 只要是对象都会转换成true

null 和 undifined

  • null 此处的值为空对象
  • undefined 此处应该有值,但是还没有赋值

数组操作

  • unshift() 添加到最前面 shift()删除最前面一个
  • pop()删除最后一个 push()添加最后一个

new干了什么

  • this指向一个空对象,将构造函数的值赋值给对象,然后返回this
this = {};
this.name;
return this;

闭包(能访问函数内部变量的函数及其上下文环境)

  • 使用返回函数实现使用内部变量,防止局部变量释放,外部一直持有内部变量的使用。
  • 避免全局污染,能够达到常驻内存。

原型和原型链

  • 对象都有proto
  • 函数才有prototype
  • 每个对象都有proto,且指向的也是个原型对象,也有proto,所以成为了原型链

ajax 同步属性

  • async:false 默认为true 表示异步

sql left join 和 right join

  • left join(左联接) 返回包括左表中的所有记录和右表中联结字段相等的记录
  • right join(右联接) 返回包括右表中的所有记录和左表中联结字段相等的记录
  • inner join(等值连接) 只返回两个表中联结字段相等的行
    举例如下:

表A记录如下:
aID     aNum
1     a20050111
2     a20050112
3     a20050113
4     a20050114
5     a20050115

表B记录如下:
bID     bName
1     2006032401
2     2006032402
3     2006032403
4     2006032404
8     2006032408


1.left join
sql语句如下:
select * from A
left join B
on A.aID = B.bID

结果如下:
aID     aNum     bID     bName
1     a20050111    1     2006032401
2     a20050112    2     2006032402
3     a20050113    3     2006032403
4     a20050114    4     2006032404
5     a20050115    NULL     NULL

(所影响的行数为 5 行)
结果说明:
left join是以A表的记录为基础的,A可以看成左表,B可以看成右表,left join是以左表为准的.
换句话说,左表(A)的记录将会全部表示出来,而右表(B)只会显示符合搜索条件的记录(例子中为: A.aID = B.bID).
B表记录不足的地方均为NULL.


2.right join
sql语句如下:
select * from A
right join B
on A.aID = B.bID

结果如下:
aID     aNum     bID     bName
1     a20050111    1     2006032401
2     a20050112    2     2006032402
3     a20050113    3     2006032403
4     a20050114    4     2006032404
NULL     NULL     8     2006032408

(所影响的行数为 5 行)
结果说明:
仔细观察一下,就会发现,和left join的结果刚好相反,这次是以右表(B)为基础的,A表不足的地方用NULL填充.


3.inner join
sql语句如下:
select * from A
innerjoin B
on A.aID = B.bID

结果如下:
aID     aNum     bID     bName
1     a20050111    1     2006032401
2     a20050112    2     2006032402
3     a20050113    3     2006032403
4     a20050114    4     2006032404

结果说明:
很明显,这里只显示出了 A.aID = B.bID的记录.这说明inner join并不以谁为基础,它只显示符合条件的记录.


注:
LEFT JOIN操作用于在任何的 FROM 子句中,组合来源表的记录。使用 LEFT JOIN 运算来创建一个左边外部联接。左边外部联接将包含了从第一个(左边)开始的两个表中的全部记录,即使在第二个(右边)表中并没有相符值的记录。

语法:FROM table1 LEFT JOIN table2 ON table1.field1 compopr table2.field2

说明:table1, table2参数用于指定要将记录组合的表的名称。
field1, field2参数指定被联接的字段的名称。且这些字段必须有相同的数据类型及包含相同类型的数据,但它们不需要有相同的名称。
compopr参数指定关系比较运算符:"=", "<", ">", "<=", ">=" 或 "<>"。
如果在INNER JOIN操作中要联接包含Memo 数据类型或 OLE Object 数据类型数据的字段,将会发生错误.

事件委托 事件代理

jsonp

jquery 三层ajax

  • 对于封装的方式,jQuery 采用了三层封装:最底层的封装方法为:$.ajax(),而通过这 层封装了第二层有三种方法:.load()、$.get()和$.post(),最高层是$.getScript()和$.getJSON() 方法。
  • .load()方法可以参数三个参数:url(必须,请求html文件的url地址,参数类型为String)、 data(可选,发送的 key/value 数据,参数类型为 Object)、callback(可选,成功或失败的回调 函数,参数类型为函数 Function)。
  • 如果想让 Ajax 异步载入一段 HTML 内容,我们只需要一个 HTML 请求的 url 即可。
$('input').click(function () { $('#box').load('test.html');
});
  • 如果想对载入的 HTML 进行筛选,那么只要在 url 参数后面跟着一个选择器即可。
$('input').click(function () {
$('#box').load('test.html .my'); });
  • 如果是服务器文件,比如.php。一般不仅需要载入数据,还需要向服务器提交数据,那 么我们就可以使用第二个可选参数 data。向服务器提交数据有两种方式:get 和 post。
//不传递 data,则默认 get 方式 $('input').click(function () {
$('#box').load('test.php?url=ycku'); });
//get 方式接受的 PHP <?php
if ($_GET['url'] == 'ycku') {
echo '瓢城 Web 俱乐部官网';
} else {
echo '其他网站';
    } 
?>

//传递 data,则为 post 方式 $('input').click(function () {
$('#box').load('test.php', { url : 'ycku'
}); });
//post 方式接受的 PHP <?php
if ($_POST['url'] == 'ycku') {
echo '瓢城 Web 俱乐部官网';
} else {
echo '其他网站';
} ?>
  • 在 Ajax 数据载入完毕之后,就能执行回调函数 callback,也就是第三个参数。回调函数 也可以传递三个可选参数:responseTex(t 请求返回)、textStatus(请求状态)、XMLHttpRequest (XMLHttpRequest 对象)。
$('input').click(function () { $('#box').load('test.php', {
url : 'ycku'
}, function (response, status, xhr) {
alert('返回的值为:' + response + ',状态为:' + status + ',
状态是:' + xhr.statusText);
}); });
  • 注意:status 得到的值,如果成功返回数据则为:success,否则为:error。XMLHttpRequest 对象属于 JavaScript 范畴,可以调用一些属性如下:


    屏幕快照 2017-09-21 下午7.28.06.png
  • 如果成功返回数据,那么 xhr 对象的 statusText 属性则返回'OK'字符串。除了'OK'的状态 字符串,statusText 属性还提供了一系列其他的值,如下:


    屏幕快照 2017-09-21 下午7.33.25.png
  • .load()方法是局部方法,因为他需要一个包含元素的 jQuery 对象作为前缀。而$.get()和
    $.post()是全局方法,无须指定某个元素。对于用途而言,.load()适合做静态文件的异步获取, 而对于需要传递参数到服务器页面的,$.get()和$.post()更加合适。
  • $.get()方法有四个参数,前面三个参数和.load()一样,多了一个第四参数 type,即服务 器返回的内容格式:包括 xml、html、script、json、jsonp 和 text。第一个参数为必选参数, 后面三个为可选参数。
//使用$.get()异步返回 html 类型 $('input').click(function () {
$.get('test.php', { url : 'ycku'
}, function (response, status, xhr) { if (status == 'success') {
$('#box').html(response); 
    }
  • 注意:第四参数 type 是指定异步返回的类型。一般情况下 type 参数是智能判断,并不 需要我们主动设置,如果主动设置,则会强行按照指定类型格式返回。
    -$.post()方法的使用和$.get()基本上一致,他们之间的区别也比较隐晦,基本都是背后的 不同,在用户使用上体现不出。具体区别如下:
    1.GET 请求是通过 URL 提交的,而 POST 请求则是 HTTP 消息实体提交的;
    2.GET 提交有大小限制(2KB),而 POST 方式不受限制;
    3.GET 方式会被缓存下来,可能有安全性问题,而 POST 没有这个问题;
    4.GET 方式通过$_GET[]获取,POST 方式通过$_POST[]获取。
//使用$.post()异步返回 html $.post('test.php', {
url : 'ycku'
}, function (response, status, xhr) {
$('#box').html(response); });
  • jQuery 提供了一组用于特定异步加载的方法:$.getScript(),用于加载特定的 JS 文件;
    $.getJSON(),用于专门加载 JSON 文件。
  • 有时我们希望能够特定的情况再加载 JS 文件,而不是一开始把所有 JS 文件都加载了,
    这时课时使用$.getScript()方法。
//点击按钮后再加载 JS 文件 $('input').click(function () {
$.getScript('test.js'); });
  • $.getJSON()方法是专门用于加载 JSON 文件的,使用方法和之前的类似。
$('input').click(function () {
$.getJSON('test.json', function (response, status, xhr) { alert(response[0].url);
}); });
  • $.ajax()是所有 ajax 方法中最底层的方法,所有其他方法都是基于$.ajax()方法的封装。
    这个方法只有一个参数,传递一个各个功能键值对的对象。
  • url String 发送请求的地址
  • type String 请求方式:POST 或 GET,默认 GET
  • timeout Number 设置请求超时的时间(毫秒)
  • data Object 或 String 发送到服务器的数据,键值对字符串或对象
  • dataType String 返回的数据类型,比如 html、xml、json 等
  • success Function 请求成功后调用的回调函数
  • error Function 请求失败时调用的回调函数
  • async Boolean 是否异步处理。默认为 true,false 为同步处理
  • jsonp String 指定一个查询参数名称来覆盖默认的 jsonp 回调 参数名 callback。

通过表单名 通过表单名.标签名.value

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 196,264评论 5 462
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 82,549评论 2 373
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 143,389评论 0 325
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 52,616评论 1 267
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 61,461评论 5 358
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 46,351评论 1 273
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 36,776评论 3 387
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 35,414评论 0 255
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 39,722评论 1 294
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,760评论 2 314
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,537评论 1 326
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,381评论 3 315
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 37,787评论 3 300
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,030评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,304评论 1 252
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 41,734评论 2 342
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 40,943评论 2 336

推荐阅读更多精彩内容