web前端面试题课件.docx

1　请实现，鼠标点击页面中的任意标签，alert该标签的名称．（注意兼容性）答：document.onclick=function(e){? e=e||window.event;? var o=e.srcElement||e.target;? alert(o.tagName);}? ?2 请指出一下代码的性能问题，并经行优化。?? var info=腾讯拍拍网（）是腾讯旗下知名电子商务网站。;?? info +=拍拍网于2005年9月12日上线发布，;?? info +=2006年3月13日宣布正式运营，;?? info +=是目前国内第二大电子商务平台。;?? info=info.split(,);?? for(var i=0; iinfo.length; i++)??? {?????? alert(info[i]);??? }答:输出字符串没有必要用for。3?? 请给出异步加载js方案，不少于两种。答:1.直接document.write);??????? script??????? document.write(script src=test.js/script);??????? /script???? 2.动态改变已有script的src属性??????? script src= id=s1script??????? script??????? s1.src=test.js??????? /script???? 3.动态创建script元素??????? script??????? var oHead=document.getElementsByTagName(HEAD).item(0);??????? var oScript=document.createElement(script);??????? oScript.type=text/javascript;??????? oScript.src=test.js;??????? oHead.appendChild(oScript);?????? /script4?? 请写出jQuery绑定事件的方法，不少于两种。答:$().click()$().ready()$().change()$().focus()5?? 请设计一套方案，用于确保页面中JS加载完全。答:原生用onload,jq用ready。6. 用 CSS 实现布局让我们一起来做一个页面首先，我们需要一个布局。请使用 CSS 控制 3 个 div，实现如下图的布局。这题不难，在平时项目开发过程中也经常会碰到：主要考虑几个问题：1. IE6 的 3 像素 BUG；2. 清楚浮动；CSS代码[css]?view plaincopy*{margin:0;padding:0;}??div{background:blue;}??.frist{float:left;width:100px;height:150px;}??.second{clear:left;float:left;width:100px;height:150px;margin:10px?0?0?0;}??.third{width:200px;height:310px;margin-left:110px;_margin-left:107px;}??XML/HTML代码[html]?view plaincopydiv?class=first?id=first1/div????div?class=second?id=second2/div????div?class=third?id=third3/div??7. 用 javascript 优化布局由于我们的用户群喜欢放大看页面于是我们给上一题的布局做一次优化。当鼠标略过某个区块的时候，该区块会放大25%，并且其他的区块仍然固定不动。提示：也许，我们其他的布局也会用到这个放大的效果哦。可以使用任何开源代码，包括曾经你自己写的。关键字：javascript、封装、复用惭愧啊，用上边那个布局我怎么也没把它优化出来，硬这头皮用绝对定位改了布局；所以样式改成了这样[css]?view plaincopy*{margin:0;padding:0;}??div{background:blue;?position:absolute}??.first{width:100px;height:150px;float:left;}??.second{top:160px;width:100px;height:150px;}??.third{width:200px;?left:110px;height:310px}??javascript 要考虑封装、复用[javascript]?view plaincopyscript?type=tex