- 什么是跨域,它主要解决什么问题?
- 如果你有8个不同的css样式,整合进网站的最好方式是?
如果仅需要引入一个CSS文件,则使用连接方式,如果需要引入多个CSS文件,则首先用连接方式引入一个“目录”CSS文件,这个“目录”CSS文件中再使用导入式引入其他CSS文件。
如果希望用javascript来动态决定引入哪个css文件,则必须使用连接式才能实现。
链接方式:最能体现CSS特点的方法;最能体现DIV+CSS中的内容与显示分离的思想,也最易改版维护,代码看起来也是最美观的一种。会在装载页面主体部分之前装载css文件,这样显示出来的网页从一开始就是带有样式效果的,
行间样式:最长见得就是访问量大的门户网站。或者访问量较大的企业网站的首页。与第一种方法比起来,优点突出,弊端也明显。优点:速度快,所有的CSS控制都是针对本页面标签的,没有多余的CSS命令;再者不用外链CSS文件。直接在HTML文档中读取样式。缺点就是改版麻烦些,单个页面显得臃肿,CSS不能被其他HTML引用造成代码量相对较多,维护也麻烦些。
导入式:会在整个页面装载完成后再装载CSS文件,对于有的浏览器来说,在一些情况下,如果网页文件的体积比较大,则会出现先显示无样式的页面,闪烁一下之后再出现设置样式后的效果,从浏览者的感受来说,这是导入式的一个缺陷。
问题1.到底link和@import有什么区别?
我们先来看看他们的定义Quote link元素
HTML和XHTML都有一个结构,它使网页作者可以增加于HTML文档相关的额外信息。这些额外资源可以是样式化信息(CSS)、导航助手、属于另外形式的信息(RSS)、联系信息等等。Quote @import
指定导入的外部样式表及目标设备类型。其实link和@import的最根本区别就是,link是一个html的一个标签,而@import是css的一个标签,
link除了调用css外还可以有其他作用譬如声明页面链接属性,声明目录,rss等等,而@import就只能
调用css。如果单独从外部引用css来说,他们的作用是基本一样,只不过上面的老大不一样而已。:)问题2.link和import到底那个更好?
只能说具体情况具体分析。
1)我要用javascript进行样式选择;
这个时候就要用link,因为link是html元素,可用javascript去控制dom元素最后达到改变样式的效果。2)应用打印样式;
打印样式顾名思义就是打印页面时候的样式。
这个样式在普通浏览下是没有效果的,只有在打印的时候生效。
如果要为页面单独引用打印样式的话,link和@import都可以的。3)引用多个样式;
如果要在一个页面上引用多个样式组合产生效果的话,link和@import也是都可以的。
大家似乎都是用的“通过使用百分比绝对定位,与外补丁负值的方法,负值的大小为其自身宽度高度的一半”达到让层垂直居中的效果。
看下面的代码:
div.innerbox {
position:absolute;
top:50%;
left:50%;
margin:-100px 0 0 -100px;
width:200px;
height:200px;
border:1px solid red
}这样写必须固定浮动层的大小,才能用margin负值一半达到居中的效果,如果在让innerBox相对于一个父级层实现水平垂直居中,只需设置父级层的position:relative定位即可。
- 介绍一下你现时的开发环境?
- 请列出你知道的图片格式,并分别阐述使用它们的理由
- 你有什么业余项目吗?是哪种类型的?
- 说说把多个PSD转化成HTML的工作步骤和有什么应该注意的地方?
事件绑定和普通事件
事件绑定
假设有个对象obj1,用on+event绑定事件如下:
obj1.onclick=function1; obj1.onclick=function2;
这里的onclick是作为obj1的属性绑定事件,function1会被function2覆盖而只执行function2;
因此取消绑定事件只需:obj1.onclick=null;
在支持W3C标准的浏览器中绑定事件用的是addEventListener:
obj1.addEventListener("click",change1,false); obj1.addEventListener("click",change2,false);
事件执行顺序跟绑定顺序一样,先执行change1,再执行change2
事件取消绑定:obj1.removeEventListener("click",change1,false);
另外在IE里面,绑定事件要用attachEvent绑定:
obj1.attachEvent("onclick",change1); obj1.attachEvent("onclick",change2);
事件取消绑定:
obj1.detachEvent("onclick",change1);
绑定是事件名称同样要以on为前缀,而且没有后面是否冒泡的boolean值,但是这种执行顺序变了,前面那种方法是依次,这种就是倒序,先执行change2,再执行change1.
要想让 JavaScript 对用户的操作作出响应,首先要对 DOM 元素绑定事件处理函数。所谓事件处理函数,就是处理用户操作的函数,不同的操作对应不同的名称。
事件绑定在JavaScript中,有三种常用的绑定事件的方法:
- 在DOM元素中直接绑定;
<input type=
"button"
value=
"click me"
onclick=
"hello()"
>
- 在JavaScript代码中绑定;
document.getElementById(
"btn"
).onclick =
function
(){
alert(
"hello world!"
);
}
- 绑定事件监听函数。
用 addEventListener() 或 attachEvent() 来绑定事件监听函数。下面详细介绍,事件监听。
事件监听
关于事件监听,W3C规范中定义了3个事件阶段,依次是捕获阶段、目标阶段、冒泡阶段。
起初Netscape制定了JavaScript的一套事件驱动机制(即事件捕获)。随即IE也推出了自己的一套事件驱动机制(即事件冒泡)。最后W3C规范了两种事件机制,分为捕获阶段、目标阶段、冒泡阶段。IE8以前IE一直坚持自己的事件机制(前端人员一直头痛的兼容性问题),IE9以后IE也支持了W3C规范。
W3C规范
语法:
element.addEventListener(event, function, useCapture)
event : (必需)事件名,支持所有 DOM事件 。
function:(必需)指定要事件触发时执行的函数。
useCapture:(可选)指定事件是否在捕获或冒泡阶段执行。true,捕获。false,冒泡。默认false。
注:IE8以下不支持。
IE标准
语法:
element.attachEvent(event, function)
event:(必需)事件类型。需加“on“,例如:onclick。
function:(必需)指定要事件触发时执行的函数。
事件监听的优点
1、可以绑定多个事件。常规的事件绑定只执行最后绑定的事件。
2、可以解除相应的绑定
btn5.removeEventListener(
"click"
,hello2);
事件委托
事件委托就是利用冒泡的原理,把事件加到父元素或祖先元素上,触发执行效果。
事件委托优点
1、提高JavaScript性能。
2、动态的添加DOM元素,不需要因为元素的改动而修改事件绑定。
- 在DOM元素中直接绑定;
- 你使用哪些工具和技术来调试JavaScript代码?
firebug,chrome, - 你都使用过哪些前端开发框架?并说说为什么使用它们?
jQuery框架:
Bootstrap: - 你是如何快速开展一个新的Web或者mobile项目的?
- 熟悉哪个版本管理控制系统?你是如何使用它们的?
git - 请你用你所知道的JavaScript原生API代替JQuery的id选择器$('#id')。
call和apply的区别
关于函数的闭包,继承,原型。Object.call(this,obj1,obj2,obj3) Object.apply(this,arguments) 第一个参数是上下文,如果没有指定上下文则为全局对象;第二个参数是要传递的参数,call是参数序列,apply是包含参数的数组
闭包 是指在 JavaScript 中,内部函数总是可以访问其所在的外部函数中声明的参数和变量,即使在其外部函数被返回(寿命终结)了之后。因为 函数 是 JavaScript 中唯一拥有自身作用域的结构,因此闭包的创建依赖于函数。 - 原型 当我们创建一个函数时,其实这个函数也就默认的拥有了一个属性叫做prototype,这个属型叫做原型属性,他是一个指针,指向了这个函数的原型对象,这个原型对象有一个默认的属性叫做constructor,这个属型指向了拥有protptype属型的函数。原型的用处是产生动态的对象和事件处理
继承 对象冒充、原型方式。js中的继承,是面向对象的知识,因为js没有类的概念,所以继承是通过对象实现的,谈到继承,就必须说到prototype在实际的项目中,我们通常都是用构造函数来创建一个对象,再将一些常用的方法添加到其原型对象上。最后要么直接实例化该对象,要么将它作为父类,再申明一个对象,继承该父类。
而在继承的时候有两种常用方式
- 你是怎么对网站进行优化的?
- 请描述一下近期最流行的事件。
- 如果今年你打算熟练掌握一项新技术,那会是什么?
- 列出一些你经常访问的网站(前端相关)?
- 前端方面你看过哪些书,都有什么收获?
- 怎么理解前端技术的大趋势?自己再做哪方面的知识储备?
- 你用过那些技术(后端)编写过项目或demo?
-
jQuery on()方法是官方推荐的绑定事件的一个方法。
$(selector).on(event,childSelector,data,function,map)
描述一下jQuery中的on(),delegate(),bind(),live()的区别。
.bind():绑定事件处理函数的最基本方式是使用.bind()方法。它和live()方法一样,接受两个参数:.bind(event type, event handler)
.live():live方法和bind方法的唯一区别在于.live()不仅作用于DOM中当前存在的元素,还作用于将来可能存在(动态生成)的元素
delegate()方法:为指定的元素(属于被选元素的子元素)添加一个或多个事件处理程序,
并规定当这些事件发生时运行的函数。从jQuery 1.7开始,.delegate()已经被.on()方法取代。
语法:$(selector).delegate(childSelector,event type,function)
参数说明:childSelector 必需。规定要附加事件处理程序的一个或多个子元素。
event 必需。规定附加到元素的一个或多个事件。由空格分隔多个事件值。必须是有效的事件。
function 必需。规定当事件发生时运行的函数。
-
react
是一个渲染视图的库React 提供了模板语法以及一些函数钩子用于基本的 HTML 渲染。
前端学习--多益
最新推荐文章于 2022-04-16 11:11:45 发布