九道前端面试题及答案,妹子总结的-阿里云开发者社区

开发者社区> cacao111> 正文

九道前端面试题及答案,妹子总结的

简介:
+关注继续查看

1、什么是W3C标准?

WEB标准不是某一个标准,而是一系列标准的集合。网页主要由三部分组成:结构(Structure)、表现(Presentation)和行为(Behavior)。对应的标准也分三方面:结构化标准语言主要包括XHTML和XML,表现标准语言主要包括CSS,行为标准主要包括对象模型(如W3C DOM)、ECMAScript等。

2、bootstrap响应式原理

是通过栅格系统和媒体查询实现的 // 小屏幕(平板,大于等于 768px)@media (min-width: @screen-sm-min) { ... }// 中等屏幕(桌面显示器,大于等于 992px)@media (min-width: @screen-md-min) { ... }// 大屏幕(大桌面显示器,大于等于 1200...

3、HTML/XHTM的区别

XHTML 与 HTML 4.01 标准没有太多的不同。
XHTML 元素必须被正确地嵌套。
XHTML 元素必须被关闭。
标签名必须用小写字母。
XHTML 文档必须拥有根元素。

4、页面构架和布局

布局可以是编码方面的,也可以是视觉方面的。
编码方面的涉及到语义化标签(也包含了div+css)布局、iframe框架(特殊地方使用)布局和表格布局(只用于一些特殊的地方,不推荐全站使用),具体你可以百度下了解学习下相关知识。

如果是视觉交互方面的,就比较多了,每年都会有新的设计布局,高级一点的比如视差类型布局,全屏布局,瀑布流,无缝拼图布局等,这些都不局限于传统的布局方式;传统电子商务、信息类的大多采用单栏、两栏或者三栏布局,还有更多栏布局;分辨率相关的宽屏布局和窄屏布局,感应式布局。太多的选择了,要学习的东西也比较多,要慢慢了解啦。还有更多的布局需要慢慢摸索和体验。我把我知道的说了。
至于手机端,例举一些:竖排列表、横排方块、九宫格、TAB切换式、手风琴布局(有多个分类及其内容同时展示)、抽屉/侧边栏、标签场景式),因为屏幕小,要增加用户体验都可以根据具体情况用不同的布局方式。

5、BootStrap学习笔记,优缺点总结

优点:

  • BT的优势之一就是可以根据用户屏幕尺寸调整页面,使其在各个尺寸上都表现良好。

  • BT预先定义了很多CSS类,使用的时候直接给class赋予对应的类名即可,如text-left,text-align,.table等。最有代表性的就是btn类,BT定义了一个.bt的基础类,如果还想要其他样式可以在这个基础类上进行扩展,实现不同的视觉效果。

  • BT的JavaScript插件非常丰富,既可以用现成的也可以自己扩充,BT提供了一个集成板的BT.js您可以直接拿过来使用也可以单个使用引入*.js即可。

不足:

  • 对IE兼容也存在不小的问题,BT将所有的元素盒模型都设置成了border-box,这是IE混杂模式下的盒模型,光这点就导致了不能兼容IE。此外还用到了大量的H5标签以及CSS3语法,这些语法标签兼容性方面同样存在不小的问题,当然网上存在很多兼容IE的办法,但需要引入其他文件,有些还不小,势必导致加载速度变慢,影响用户体验。

  • BT对IE6,7的兼容性肯定不好,对IE8的支持也需要一些额外的文件。
    IE8的媒体查询需要response.js的配合才能实现

  • BT 不支持 IE 古老的兼容模式。为了让 IE 浏览器运行最新的渲染模式下,建议将此 <meta> 标签加入到你的页面中:
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    按 F12 键打开 IE 的调试工具,就可以看到 IE 当前的渲染模式是什么。

BT属于前端UI库,可以快速搭建前端页面,以及设计响应式界面,还可以使用saas重新设计组件,

6、JQeury学习笔记,优缺点总结

优点:

  • jQuery实现脚本与页面的分离,是操作DOM的首选js库。

  • 最少的代码做最多的事情
    最少的代码做最多的事情,这是jQuery的口号,而且名副其实。使用它的高级selector,开发者只需编写几行代码就能实现令人惊奇的效果。开发者无需过于担忧浏览器差异,它除了还完全支持Ajax,而且拥有许多提高开发者编程效率的其它抽象概念。jQuery把JavaScript带到了一个更高的层次。以下是一个非常简单的示例:
    代码如下:
    $("p.neat").addClass("ohmy").show("slow");
    通过以上简短的代码,开发者可以遍历“neat”类中所有的<p>元素,然后向其增加“ohmy”类,同时以动画效果缓缓显示每一个段落。开发者无需检查客户端浏览器类型,无需编写循环代码,无需编写复杂的动画函数,仅仅通过一行代码就能实现上述效果。

  • 性能
    在大型JavaScript框架中,jQuery对性能的理解最好。尽管不同版本拥有众多新功能,其最精简版本只有18KB大小,这个数字已经很难再减少。jQuery的每一个版本都有重大性能提高。

  • 插件
    基于jQuery开发的插件目前已经有大约数千个。开发者可使用插件来进行表单确认、图表种类、字段提示、动画、进度条等任务。

  • 节省开发者学习时间
    当然要想真正学习jQuery,开发者还是需要投入一点时间,尤其是如果你要编写大量代码或自主插件的话,更是如此。但是,开发者可以采取“各个击破”的方式,而且jQuery提供了大量示例代码,入门是一件非常容易的事情。

不足:

  • 不能向后兼容

  • 插件兼容性。

  • jQuery的稳定性

  • 在大型框架中,jQuery核心代码库对动画和特效的支持相对较差。

7、”高内聚 ,低耦合“到底是什么意思?

‘高内聚,低耦合’是相对于代码而言,一个项目中:
每个模块之间相互联系的紧密程度,模块之间联系越紧密,则耦合性越高,模块的独立性就越差!反之同理;
一个模块中各个元素之间的联系的紧密程度,如果各个元素(语句、程序段)之间的联系程度越高,则内聚性越高,即‘高内聚’ !
如: 一个项目中有20个方法调用良好,但是要修改了其中一个,另外的19个都要进行修改,这就是高耦合!独立性太差!
现在的软件结构设计,都会要求“高内聚,低耦合”,来保证软件的高质量!mark!

8、对前后端联合开发 的技术原理(Ajax、Json)有一定认识,理解DOM、Xml概念, 熟悉前后台交互方式。

  • Ajax异步交互原理:Ajax其核心有JavaScript、XMLHTTPRequest、DOM对象组成,通过XmlHttpRequest对象来向服务器发异步请求,从服务器获得数据,然后用JavaScript来操作DOM而更新页面。

  • Json:一般我用的比较多的是通过AJAX异步来获取JSON数据。

  • DOM:文档对象模型,一个网页中所有的东西都是dom节点,根节点是<html>,它可以无线嵌套。用来获取或设置文档中标签的属性,例如获取或者设置input表单的value值。

  • BOM:浏览器对象模型。用来获取或设置浏览器的属性、行为,例如:新建窗口、获取屏幕分辨率、浏览器版本号等。

  • XML:被设计用来传输和存储数据,被设计用来格式化和显示数据。仅仅是纯文本。
    -前后台交互方式:

9、GET和POST请求的区别

  • GET提交的数据会放在URL之后,以?分割URL和传输数据,参数之间以&相连,如EditPosts.aspx?name=test1&id=123456. POST方法是把提交的数据放在HTTP包的Body中.

  • GET提交的数据大小有限制(因为浏览器对URL的长度有限制),而POST方法提交的数据没有限制.

  • GET方式需要使用Request.QueryString来取得变量的值,而POST方式通过Request.Form来获取变量的值。

  • GET方式提交数据,会带来安全问题,比如一个登录页面,通过GET方式提交数据时,用户名和密码将出现在URL上,如果页面可以被缓存或者其他人可以访问这台机器,就可以从历史记录获得该用户的账号和密码.

原文发布时间:2018年05月31日

作者:O_禾火_O

本文来源:奔三路学习网  如需转载请联系原作者

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
web前端技能方法总结(css、js、jquery、html)(27)
web前端技能方法总结(css、js、jquery、html)
7 0
前端跨域问题的总结&&nodejs 中间层的路由转发
前后端交互的时候,跨域是避不开的问题。 总结就是如下: 1.Cors 我在做前后端分离的时候,会采用cors 的方法:便于其他源的调用接口,这个可以设置成任意的源头,也可以允许指定的源头。 下面的是nodejs 做后台的一个示例: //设置跨域访问 在做前后端分离,nodejs提供接口的时候,这个设置跨域请求必不可少 app.
1731 0
web前端技能方法总结(css、js、jquery、html)(28)
web前端技能方法总结(css、js、jquery、html)
11 0
前端智能化 2020 年中总结和反思
与大家分享阿里前端在智能化方向上的实践和思考
2957 0
web前端技能方法总结(css、js、jquery、html)(30)
web前端技能方法总结(css、js、jquery、html)
18 0
阿里云服务器端口号设置
阿里云服务器初级使用者可能面临的问题之一. 使用tomcat或者其他服务器软件设置端口号后,比如 一些不是默认的, mysql的 3306, mssql的1433,有时候打不开网页, 原因是没有在ecs安全组去设置这个端口号. 解决: 点击ecs下网络和安全下的安全组 在弹出的安全组中,如果没有就新建安全组,然后点击配置规则 最后如上图点击添加...或快速创建.   have fun!  将编程看作是一门艺术,而不单单是个技术。
4504 0
第140天:前端开发中浏览器兼容性问题总结(一)
我们在开发的时候会明确项目要兼容哪些浏览器的最低版本,我之前的项目要求兼容IE8.0以上的版本,Chrome 48以上,FireFox 44以上。有了这些最基本的要求,在开发中就是要考虑到CSS样式和JavaScript的在这些浏览器的兼容性了一、html部分 1.H5新标签在IE9以下的浏览器识别   html5shiv.js下载地址 https://github.com/aFarkas/html5shiv/releases2.ul标签内外边距问题 ul标签在IE6\IE7中,有个默认的外边距,但是在IE8以上及其他浏览器中有个默认的内边距。
987 0
+关注
41
文章
0
问答
文章排行榜
最热
最新
相关电子书
更多
文娱运维技术
立即下载
《SaaS模式云原生数据仓库应用场景实践》
立即下载
《看见新力量:二》电子书
立即下载