百度校园招聘web前端笔试题及答案(2008电子科大)
1. 请问一份标准的 HTML 文档有哪几个必须的 HTML 标签?
The elements which every document must have are: <html>
, <head>
, <title>
.
2. Javascript中为Array对象添加一个去掉重复项的方法?
YUI版本
var toObject = function(a) { var o = {}; for (var i = 0; i < a.length; i = i+1) { o[a[i]] = true; } return o; }; var keys = function(o) { var a=[], i; for (i in o) { if (lang.hasOwnProperty(o, i)) { // YUI的方法 a.push(i); } } return a; }; var uniq = function(a) { return keys(toObject(a)); };
改进版
var uniq = function (arr) { var a = [], o = {}, i, v, len = arr.length; if (len < 2) { return arr; } for (i = 0; i < len; i++) { v = arr[i]; if (o[v] !== 1) { a.push(v); o[v] = 1; } } return a; }
使用 Array.indexOf() 的思路也是不错的选择,对于已经支持的浏览器直接用原生的 Array.indexOf() 方法,对于未支持的,我们增加 Array.indexOf() 方法,如下:
if(!Array.prototype.indexOf) { Array.prototype.indexOf = function (obj, fromIndex) { if (fromIndex == null) { fromIndex = 0; } else if (fromIndex < 0) { fromIndex = Math.max(0, this.length + fromIndex); } for (var i = fromIndex; i < this.length; i++) { if (this[i] === obj) return i; } return -1; }; }
3. 如何在Javascript中调用以下几个CSS属性: font-size, border-top-width, -moz-border-radius
Object.style.fontSize Object.style.borderTopWidth Object.style.borderRadius = '1em'; // standard Object.style.MozBorderRadius = '1em'; // Mozilla Object.style.WebkitBorderRadius = '1em'; // WebKit
4, JavaScript 脚本如何对一个对象进行深度 Clone?
用js实现对象克隆最关键的两点就是:var objClone = new this.constructor(); 和objClone[key] = this[key].Clone(); 。一个实现相同对象创建,一个实现深度克隆。
Object.prototype.Clone = function () { var objClone; if (this.constructor == Object) { objClone = new this.constructor(); } else { objClone = new this.constructor(this.valueOf()); } for (var key in this) { if (objClone[key] != this[key]) { if (typeof (this[key]) == ‘object’) { objClone[key] = this[key].Clone(); } else { objClone[key] = this[key]; } } } objClone.toString = this.toString; objClone.valueOf = this.valueOf; return objClone; }
5, 有一个宽度不定高度不定的圆角框图,先要切成网页,请写出 HTML+CSS 代 码?
方法一:使用css来实现
<head> <title>css圆角效果</title> <meta http-equiv="content-type" content="text/html; charset=gb2312"> <style type="text/css"> div.RoundedCorner{background: #9BD1FA} b.rtop, b.rbottom{display:block;background: #FFF} b.rtop b, b.rbottom b{display:block;height: 1px;overflow: hidden; background: #9BD1FA} b.r1{margin: 0 5px} b.r2{margin: 0 3px} b.r3{margin: 0 2px} b.rtop b.r4, b.rbottom b.r4{margin: 0 1px;height: 2px} </style> </head> <body> <div class="RoundedCorner"> <b class="rtop"><b class="r1"></b><b class="r2"></b><b class="r3"></b><b class="r4"></b></b> <br>无图片实现圆角框<br><br> <b class="rbottom"><b class="r4"></b><b class="r3"></b><b class="r2"></b><b class="r1"></b></b> </div> </body>
方法二:使用图片 + css
使用photoshop将图片的四个圆角切下来
使用表格 分别设置四个角的背景图片为 圆角图片。
近可能的将图片的圆角切的小一点
存在问题 :表格至少要3行3列 且最外面的行和列是不能写任何文字的
但是这样做出来的圆角表格也是可以任意变化的
6, 用 JavaScript 写一个图片跑马灯程序,图片从右向左动态无缝移动
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>demo</title> <style type="text/css"> *{ margin:0 0; padding:0 0; } #outDemo{ overflow:hidden; width:200px; border:2px solid #e0e0e0; padding:2px; } #outDemo div{ float:left; padding:1px; } #innDemo{ white-space:nowrap; } img{ border:0px solid #fff; } </style> <script type="text/javascript"> window.onload = function(){ var demo = document.getElementById("outDemo"); var demo1 = document.getElementById("innDemo"); demo1.innerHTML += demo1.innerHTML; function move(){ demo.scrollLeft = demo.scrollLeft==240?demo.scrollLeft=1:demo.scrollLeft+1; } function go(){ setInterval(move,20); } go(); } </script> </head> <body> <div id='outDemo'> <div id='innDemo'> <a href='javascript:;'><img src="images/apple439.PNG" alt="apple439.PNG" width="111px" /></a> <a href='javascript:;'><img src="images/apple440.PNG" alt="apple440.PNG" width="111px" /></a> </div> </div> </body> </html>
7, 如何对网页的加载进行性能优化?
答案略
8, [Linux]利用命令 find 查找当前目录下的名称尾为.C 的文件,并将结果输 出到标准输出的命令是_____________.
find . –name "*.c" –print
9, [Flash 附加题]请简要叙述:ActionScript 与 JavaScript 如何进行交互? 请用简要的代码说明。
一、在网页中通过JavaScript调用Flash里的ActionScript:
可以通过ExternalInterface的addCallback方法,在Flash里注册一个可以供网页上的JavaScript或ActiveX调用的方法,具体代码如下:程序代码
import flash.external.*;
var methodName:String = "PlayBB";
var instance:Object = null;
var method:Function = playB;
var ws:Boolean = ExternalInterface.addCallback(methodName, instance, method);
在JavaScript中调用时,需要为Flash所在的Object标签设置一个ID,并且设置allowScriptAccess属性,示例代码如下:程序代码
<object id="topFlash" name="topFlash" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="686" height="101">
<param name="movie" value="_top.swf" />
<param name="quality" value="high" />
<param name="allowScriptAccess" value="always" />
<embed allowScriptAccess="always" src="_top.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="686" height="101"></embed>
</object>
网页中的JavaScript具体的调用示例:程序代码
function thisMovie(movieName) {
if (navigator.appName.indexOf("Microsoft") != -1) {
return window[movieName]
}
else {
return document[movieName]
}
}
("topFlash").PlayBB();
二、在Flash的ActionScript中调用网页里的JavaScript:
直接使用ExternalInterface的Call方法就可以了,示例代码如下:程序代码
import flash.external.*;
var obj:Object = ExternalInterface.Call("JavaScript方法", "参数");
参数可以是任何As中的类型,在调用时Flash会自动封装,多参数使用,分隔。