图片 2

方法的区别,优秀的WEB前端开发框架

其实早就对Bootstrap有所耳闻,大概了解这哥们是做WEB前端的

在做项目的时候,来了这么一个需求,要求打开模态框后,点击空白的地方不让他自动关闭,只能点击关闭按钮才能关闭。

但直到昨天以前,还没有对他产生任何深入了解的兴趣

ref:

有了需求,就开始查找资料寻求解决的方法。

冷落他的主要原因还是觉得会束缚手脚,毕竟自己多年来在WEB前端的积累一直没有停滞,在这方面还没有感受到多少压力,换句话说,觉得自己还是有点倚仗的

  如果没接触过动态语言,以编译型语言的思维方式去理解javaScript将会有种神奇而怪异的感觉,因为意识上往往不可能的事偏偏就发生了,甚至觉得不可理喻.如果在学JavaScript这自由而变幻无穷的语言过程中遇到这种感觉,那么就从现在形始,请放下的您的”偏见”,因为这对您来说绝对是一片新大陆,让JavaScrip

我找到的解决方法如下:

就在昨天,一个好哥们请我帮忙给做个他们内部用的小网站,要求用电脑和手机都可以正常使用

好,言归正传,先理解JavaScrtipt动态变换运行时上下文特性,这种特性主要就体现在apply, call两个方法的运用上.

$('#registCompany').modal({backdrop: 'static', keyboard: false});    参数说明:    backdrop 为 static 时,点击模态对话框的外部区域不会将其关闭。    keyboard 为 false 时,按下 Esc 键不会关闭 Modal。  

电脑用当然OK,不过要兼容手机却让我有点小兴奋,毕竟以前还没有做过真正的手机端WEB应用,正好借这个机会锻炼一下

区分apply,call就一句话,

就这一行代码解决了我的问题。

由于是独立的网站,可以完全放开手脚弄点新鲜的,当时就想起了Bootstrap,他的响应式特性还是给我留下了很深的印象

  foo.call(this, arg1,arg2,arg3) == foo.apply(this, arguments)==this.foo(arg1, arg2, arg3)


接着就按照Bootstrap文档做了一个Nav导航效果,看着不错,反色效果,很酷:

 

图片 1

call,
apply都属于Function.prototype的一个方法,它是JavaScript引擎内在实现的,因为属于Function.prototype,所以每个Function对象实例,也就是每个方法都有call,
apply属性.既然作为方法的属性,那它们的使用就当然是针对方法的了.这两个方法是容易混淆的,因为它们的作用一样,只是使用方式不同.

 

相同点:两个方法产生的作用是完全一样的

然后,调整浏览器的宽度,变小一些,模拟手机端的效果:

不同点:方法传递的参数不同

图片 2

那什么是方法产生的作用,方法传递的参数是什么呢?

 

我们就上面的foo.call(this, arg1, arg2, arg3)展开分析.

果然发生了变化,而且效果超好,这就是响应式布局的手段吗

foo是一个方法,this是方法执行时上下文相关对象,arg1, arg2,
arg3是传给foo方法的参数.这里所谓的方法执行时上下文相关对象,
如果有面向对象的编程基础,那很好理解,就是在类实例化后对象中的this.

导航菜单由原来的水平平铺变成了垂直下拉,点击右上角的按钮可以控制下拉菜单进行显隐

在JavaScript中,代码总是有一个上下文对象,代码处理该对象之内.
上下文对象是通过this变量来体现的,
这个this变量永远指向当前代码所处的对象中.

就是这个初步的体验,就觉得非常有必要对Bootstrap进行认真的、深入的了解和学习

为了更好的领会这this是什么,举个例子. 

 

  图片 3代码

把关于Bootstrap相关的几个地址保留一下,这些都是进入Bootstrap世界的钥匙:

 

1、Bootstrap中文网:

 题外话:javascript对象所有属性都是公开的(public),没私有(private)之说,所以也可直接访问message属性

2、Bootstrap v3 中文文档:

 

3、w3cschool上的Bootstrap入门教程:

alert(a.message);

发表评论

电子邮件地址不会被公开。 必填项已用*标注

标签:
网站地图xml地图