1、引入CSS的方法有两种:一种是@Import,一种是link |
---|
<link type="text/css" href="地址" rel="stylesheet"/> |
现在绝大多数网站都采用后link方法,原因在于 |
@Import先加载html,再加载css |
link先加载css,再加载html |
所以前者加载网页会出现令浏览者感觉到意外的格式,后者是带着格式去加载页面 |
2、HTML中的href和src有什么区别? |
---|
href 表示超文本引用(hypertext reference),在 link和a 等元素上使用。 |
src 表示来源地址,在 img、script、iframe 等元素上。 |
src 的内容,是页面必不可少的一部分,是引入。 |
href 的内容,是与该页面有关联,是引用。 区别就是,引入和引用。 |
3、apply和call方法的异同? |
---|
对于apply和call两者在作用上是相同的,即是调用一个对象的一个方法,以另一个对象替换当前对象。 apply:调用一个对象的一个方法,用另一个对象替换当前对象。例如:B.apply(A, arguments);即A对象应用B对象的方法。 call:调用一个对象的一个方法,用另一个对象替换当前对象。例如:B.call(A, args1,args2);即A对象调用B对象的方法。 |
将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。 |
但两者在参数上有区别的。 |
对于第一个参数意义都一样,但对第二个参数: apply传入的是一个参数数组,也就是将多个参数组合成为一个数组传入,而call则作为call的参数传入(从第二个参数开始)。 |
如 func.call(func1,var1,var2,var3)对应的apply写法为:func.apply(func1,[var1,var2,var3]) 。 |
4、定义一个log方法,让它可以代理console.log的方法。 |
---|
可行的方法一: |
function
log(msg) {
console.log(msg);
}
log(
"hello world!"
)
// hello world!
|
如果要传入多个参数呢?显然上面的方法不能满足要求,所以更好的方法是: |
function
log() {
console.log.apply(console, arguments);
};
|
5、斐波那契数列指的是这样一个数列 0,1, 1, 2, 3, 5, 8。。。第三个数是前两个数之和,求第5个数的值。 |
---|
var a=0; var b=1; var c; for(var i=0;i<3;i++){ c=a; a=b; b=b+c; } alert(b) |
6、以下代码的执行结果是什么? |
---|
|
7、浏览器对象模型BOM里常用的对象,window对象的常用方法 |
---|
对象:Window document location screen history navigator |
方法:Alert() confirm() prompt() open() close() |
8、文档对象模型DOM里document的常用的查找访问节点的方法并做简单说明 |
---|
Document.getElementById 根据元素id查找元素 |
Document.getElementByName 根据元素name查找元素 |
Document.getElementTagName 根据指定的元素名查找元素 |
9、行内元素有哪些?块级元素有哪些?空(void)元素有哪些? | ||
---|---|---|
行内元素有:a b span img input select strong(强调的语气) | ||
块级元素有:div ul ol li dl dt dd h1 h2 h3 h4…p | ||
知名的空元素: <br> <hr> <img> <input> <link> <meta> | ||
鲜为人知的是:<area> <base> <col> <command> <embed> <keygen> <param> <source> <track> <wbr> | ||
行内元素: | ||
(1)设置宽高无效 (2)对margin仅设置左右方向有效,上下无效;padding设置上下左右都有效,即会撑大空间 (3)不会自动进行换行
|
存储大小限制也不同,cookie数据不能超过4k,同时因为每次http请求都会携带cookie,所以cookie只适合保存很小的数据,如会话标识。sessionStorage和localStorage 虽然也有存储大小的限制,但比cookie大得多,可以达到5M或更大。
数据有效期不同,sessionStorage:仅在当前浏览器窗口关闭前有效,自然也就不可能持久保持;localStorage:始终有效,窗口或浏览器关闭也一直保存,因此用作持久数据;cookie只在设置的cookie过期时间之前一直有效,即使窗口或浏览器关闭。
作用域不同,sessionStorage不在不同的浏览器窗口中共享,即使是同一个页面;localStorage 在所有同源窗口中都是共享的;cookie也是在所有同源窗口中都是共享的。 |
11、什么是Ajax和JSON,他们的优缺点? |
---|
Ajax是异步JavaScript和XML,用于在Web页面中实现异步数据交互。 |
优点: 可以使得页面不重载全部内容的情况下加载局部内容,降低数据传输量 避免用户不断刷新或者跳转页面,提高用户体验 缺点: 对搜索引擎不友好 要实现ajax下的前后退功能成本较大 可能造成请求数的增加 跨域问题限制 |
JSON是一种轻量级的数据交换格式,ECMA的一个子集 优点:轻量级、易于人的阅读和编写,便于机器(JavaScript)解析,支持复合数据类型(数组、对象、字符串、数字) |
优化图片 |
优化CSS(压缩合并css,如margin-top,margin-left…) |
.网址后加斜杠(如www.campr.com/目录,会判断这个”目录是什么文件类型,或者是目录。) |
标明高度和宽度(如果浏览器没有找到这两个参数,它需要一边下载图片一边计算大小,如果图片很多,浏览器需要不断地调整页面。这不但影响速度,也影响浏览体验。 当浏览器知道了高度和宽度参数后,即使图片暂时无法显示,页面上也会腾出图片的空位,然后继续加载后面的内容。从而加载时间快了,浏览体验也更好了。) |
图像格式的选择(GIF:提供的颜色较少,可用在一些对颜色要求不高的地方) |
13、document.write和innerHTML的区别? |
---|
1.document.write是直接写入到页面的内容流,如果在写之前没有调用document.open, 浏览器会自动调用open。每次写完关闭之后重新调用该函数,会导致页面被重写。 |
2.innerHTML则是DOM页面元素的一个属性,代表该元素的html内容。你可以精确到某一个具体的元素来进行更改。如果想修改document的内容,则需要修改document.documentElement.innerElement。 |
3.两者都可动态包含外部资源如JavaScript文件 通过document.write插入<script></script>元素会自动执行其中的脚本; 大多数浏览器中,通过innerHTML插入<script></script>元素并不会执行其中的脚本 |
innerHTML很多情况下都优于document.write,其原因在于其允许更精确的控制要刷新页面的那一个部分。 |
14、foo = foo || bar ,这行代码是什么意思?为什么要这样写? |
---|
foo和bar应该都是bool型变量,||是表示 或 的意思,只要foo或者bar有一个为真,那么这个表达式的值就为真,并把它赋给foo |
15、当一个dom节点被点击时,我们需要能够执行一个函数,应该怎么做? |
---|
直接在DOM里绑定事件:”<div οnclick=”test()”>xx</div>” … |
在JS里通过onclick绑定:xxx.onclick = test |
通过事件添加进行绑定:addEventListener(xxx, ‘click’, test) |
那么问题来了,Javascript的事件流模型都有什么? |
“事件冒泡”:事件开始由最具体的元素接受,然后逐级向上传播 |
“事件捕捉”:事件由最不具体的节点先接收,然后逐级向下,一直到最具体的 |
“DOM事件流”:三个阶段:事件捕捉,目标阶段,事件冒泡 |
16、js延迟加载的方式有哪些? |
---|
js的延迟加载有助与提高页面的加载速度,以下是延迟加载的几种方法: |
1.使用setTimeout延迟方法的加载时间 |
延迟加载js代码,给网页加载留出更多时间 |
$(function (){ setTimeout(‘A()’, 1000); //延迟1秒 }) |
2、让js最后加载 |
例如引入外部js脚本文件时,如果放入html的head中,则页面加载前该js脚本就会被加载入页面,而放入body中,则会按照页面从上倒下的加载顺序来运行JavaScript的代码~~~ 所以我们可以把js外部引入的文件放到页面底部,来让js最后引入,从而加快页面加载速度 |
17、同步和异步的区别? |
---|
同步就是指一个进程在执行某个请求的时候,若该请求需要一段时间才能返回信息,那么这个进程将会一直等待下去,直到收到返回信息才继续执行下去; |
异步是指进程不需要一直等下去,而是继续执行下面的操作,不管其他进程的状态。当有消息返回时系统会通知进程进行处理,这样可以提高执行的效率。 |
举个浏览器例子:普通B/S模式(同步)AJAX技术(异步) |
同步:提交请求->等待服务器处理->处理完毕返回 这个期间客户端浏览器不能干任何事 |
异步: 请求通过事件触发->服务器处理(这是浏览器仍然可以作其他事情)->处理完毕 |
18、请解释一下什么是”语义化的 HTML”? | ||||||||||||||||||||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
“语义化”指的是机器在需要更少的人类干预的情况下能够研究和收集信息,让网页能够被机器理解,最终让人类受益。 | ||||||||||||||||||||||||||||||||||||||||||||||||
1:去掉或样式丢失的时候能让页面呈现清晰的结构: html本身是没有表现的,我们看到例如<h1>是粗体,字体大小2em,加粗;<strong>是加粗的,不要认为这是html的表现,这些其实html默认的css样式在起作用, 所以去掉或样式丢失的时候能让页面呈现清晰的结构不是的HTML结构的优点,但是浏览器都有有默认样式,默认样式的目的也是为了更好的表达html的语义,可以说浏览器的默认样式和语义化的HTML结构是不可分割的。 | ||||||||||||||||||||||||||||||||||||||||||||||||
2.屏幕阅读器(如果访客有视障)会完全根据你的标记来”读”你的网页. | ||||||||||||||||||||||||||||||||||||||||||||||||
3.PDA、手机等设备可能无法像普通电脑的浏览器一样来渲染网页(通常是因为这些设备对CSS的支持较弱). | ||||||||||||||||||||||||||||||||||||||||||||||||
4.搜索引擎的爬虫也依赖于标记来确定上下文和各个关键字的权重. | ||||||||||||||||||||||||||||||||||||||||||||||||
5.你的页面是否对爬虫容易理解非常重要,因为爬虫很大程度上会忽略用于表现的标记, 而只注重语义标记. | ||||||||||||||||||||||||||||||||||||||||||||||||
6.便于团队开发和维护 | ||||||||||||||||||||||||||||||||||||||||||||||||
语义化的HTML就是:标题用h1-h6,文字段落用p,列表用ul li,大致如此 | ||||||||||||||||||||||||||||||||||||||||||||||||
|
原创地址 https://blog.csdn.net/chenacxz/article/details/79726658