⑴ 前端菜鸟请教前端大神一个问题
canvas绘制
⑵ 新手怎么学习WEB前端开发,每日分享
老办法:勤奋多加练习咯,或者可下载绘学霸APP学习。有资料视频学习的,可看着一步一步的去学咯,加油~
⑶ 有什么可以练习前端 的软件 就那种有习题的
要习题的话去买书,书上都有。
另外还有好多种方式,这里给你介绍几种:
随便截一个网站的图,然后自己去按照图上的样子去写,样式。
样式写完之后再写交互。
像练逻辑思维的话可以找找编程题目,大部分编程的题目都是通用的,只是写法不同,逻辑一样。
⑷ 前端面试题,求大佬给个结果
第一题 true false false true
第二题 true 报错 false false true false
之前是为了赶着回答,所以随便答了,后来检查,发现也是对的了。后面说说分析:
第一个问题:
先分析最简单的页面代码function A(){};和function B(){};只是普通的函数A和B。
然后就是A的原型。
a是普通的构造函数。
先给你科普一下基础,我们创建的每个函数都有一个prototype(原型)属性,这个属性是一个指针,指向一个对象。这里面的关键字是指针!而原型属性的作用是,让对象A包含一些共享的属性和方法,而这里就是共享了方法,A原型里面的fun。
PS:有时候,面试官还会把a = new A()放在,A.prototype前面,这样就会导致原型指针混乱的问题,但是你这个问题,相对简单,没有这种情况,所以这里我也不说明了。
然后分析,问题的答案:
1、必定是true,因为每个构造函数都有一个constructor属性,且指向A。但是如果在原型对象里面自己去设置constructor属性,这样就会导致,指向Object对象,且属性变为可枚举的,如果你理解了这里,第二个问题就简单了。
2、false。上面已经提过了,如果在A的原型里面设置constructor,指向的对象肯定是Object,不信的话,你可以试试console.log(A.prototye.constructor === Object),这样一定是true。
3、就是对hasOwnProperty的理解。hasOwnProperty是检测a对象是否含有'constructor'这个属性,他检测的不是原型,而原型仅仅是一个指针,所以是false。
4、没啥好说的,很简单,就是true。
第二个问题
先对题目进行分析,new B()产生一个构造函数 而A的原型指向该构造函数
然后,var b = new A(); b和上面的a差不多 只不过A有点改变。
然后分析,答案:
1、在这里我必须说明一下A.prototye ={ } //无论对象里面是什么或者做了什么事,他一定有一个constructor属性,如果你不主动设置,他一定指向自己,也就是A,不信你自己实验,所以一定是true。
2、我实在没有发现代码中,有类似B.prototype的语句,但是B下面还是有原型属性B.prototype,只是这个属性没有被创建而已。为了确保正确,我查了查,constructor的概念,原来constructor的作用是返回对创建此对象的数组函数的引用。这里涉及了一个关键字,就是创建,所以我肯定这个问题的答案是报错的了。因为这个原型是存在的,但没被创建。而且constructor的概念,提及了一个重要的概念,引用,我不做说明了,自己网络。
3、其实这里只是绕了一个圈,等你绕过来的时候,他就是问A.prototye = new B();这里的问题了,这时候明显指向了B,不信,可以把A改为B 一定是true。而这个问题的答案是false。
4、不要被指针影响了,hasOwnProperty检测的不是原型指针,所以一定是false。
5、没什么好说的,明显为true
6、还是那句原型只是一个指针,b不可能是B的实例,只是A的原型指向了B
综合,本问题,主要考察的是对原型指针的理解,还有对constructor的认识。
⑸ web前端 基础 操作题
<!DOCTYPEhtml>
<html>
<head>
<metacharset="UTF-8">
<title>第一题</title>
<style>
html,body{width:100%;height:100%;}
body{position:relative;margin:0;}
button{position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;width:100px;height:40px;color:#FFF;font-size:16px;font-family:"微软雅黑";border-radius:8px;background-color:#f49610;}
</style>
</head>
<body>
<formaction="">
<buttononclick="alert('你点我了~~')">点我</button>
</form>
</body>
</html>
第一题如上(保存文件为.html形式)
---------------------------------------------------------------------------
第二题如下(html部分保存文件为.html形式,JS部分保存为.js文件。两个文件放在同一个文件夹下,因为我的src路径是这样写的,你可以改)
<!DOCTYPEhtml>
<html>
<head>
<metacharset="UTF-8">
<title>第二题</title>
<scriptsrc="pulsate.js"></script>
<style>
html,body{width:100%;height:100%;}
body{position:relative;margin:0;}
button{position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;width:100px;height:40px;color:#FFF;font-size:16px;font-family:"微软雅黑";border-radius:8px;background-color:#f49610;}
</style>
</head>
<body>
<formaction="">
<button>点我</button>
</form>
</body>
</html>
下面是第二题的,JS部分:
window.onload=function(){
varbtn=document.getElementsByTagName("button")[0];
btn.onclick=function(){
alert("哎呀,你又点我了~");
}
}
加油~
⑹ 前端面试题,就是一个矩形,上下左右各有一条线,如果只用一个div,css应该怎么实现,效果如下图
div{
width:130px;
height:130px;
border-radius:4px;
border:1pxsolid#333;
box-shadow:inset005px5px#ccc;
}
解析:模拟凹槽线的重要代码是最后一行,几个数值分别为
x轴的阴影偏移量
y轴的阴影偏移量
模糊度
模糊长度
⑺ 谁能给我出一两道 web前端笔试题 上机题啥的,呵呵,比较常考的
[面试题] 某企业前端开发面试题
【HTML & CSS】
1. Doctype? 严格模式与混杂模式-如何触发这两种模式,区分它们有何意义?
2. 行内元素有哪些?块级元素有哪些?CSS的盒模型?
3. CSS引入的方式有哪些? link和@import的区别是?
4. CSS选择符有哪些?哪些属性可以继承?优先级算法如何计算?内联和important哪个优先级高?
5. 前端页面有哪三层构成,分别是什么?作用是什么?
6. css的基本语句构成是?
7. 你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么?经常遇到的浏览器的兼容性有哪些?怎么会出现?解决方法是什么?
8. 如何居中一个浮动元素?
9. 有没有关注HTML5和CSS3?如有请简单说一些您对它们的了解情况!
10. 你怎么来实现下面这个设计图,主要讲述思路 (效果图省略)
11. 如果让你来制作一个访问量很高的大型网站,你会如何来管理所有CSS文件、JS与图片?
12. 你对前端界面工程师这个职位是怎么样理解的?它的前景会怎么样?
【Javascript】
1. js是什么,js和html 的开发如何结合?
2. 怎样添加、移除、移动、复制、创建和查找节点
3. 怎样使用事件以及IE和DOM事件模型之间存在哪些主要差别
4. 面向对象编程:b怎么继承a
5. 看看下面alert的结果是什么
view sourceprint?1.function b(x, y, a) {
.arguments[2] = 10;
.alert(a);
}
b(1, 2, 3);
如果函数体改成下面,结果又会是什么?
a = 10;
alert(arguments[2] );
6. 请编写一个JavaScript函数 parseQueryString,它的用途是把URL参数解析为一个对象
var obj = parseQueryString(url);
alert(obj.key0) // 输出0
7. ajax是什么? ajax的交互模型? 同步和异步的区别? 如何解决跨域问题?
8. 什么是闭包?下面这个ul,如何点击每一列的时候alert其index?
<ul id=”test”>
<li>这是第一条</li><li>这是第二条</li><li>这是第三条</li>
</ul>
9. 最近看的一篇Javascript的文章是?
10. 常使用的库有哪些?常用的前端开发工具?开发过什么应用或组件?
11.说说YSlow(可以详细一点)
答案在参考资料里面可以找到,答案在参考资料里面可以找到,答案在参考资料里面可以找到
⑻ 请问哪里可以找到带答案详解的css html等前端的题呢
一般初学者都是靠模仿学习的,有了例子可以看看他为什么这么设置,这些都是用到什么语法,可以和自己从书上看到的相互印证,也少掉了代码不熟悉的烦恼
建议楼主去下载一个简单的源码(新闻类的,企业建站类的)这些在asp集中营都有
模仿着做两个站,这样基本就能出师了,毕竟前台的代码用dreamweaver都是有代码提示的。
⑼ 有哪些经典的 Web 前端或者 JavaScript 面试笔试题
一、不定项选择题 (每题3分,共30分)
1. 声明一个对象,给它加上name属性和show方法显示其name值,以下代码中正确的是( D )
A. var obj = [name:"zhangsan",show:function(){alert(name);}];
B. var obj = {name:”zhangsan”,show:”alert(this.name)”};
C. var obj = {name:”zhangsan”,show:function(){alert(name);}};
D. var obj = {name:”zhangsan”,show:function(){alert(this.name);}};
2. 以下关于Array数组对象的说法不正确的是( CD )
A. 对数组里数据的排序可以用sort函数,如果排序效果非预期,可以给sort函数加一个排序函数的参数
B. reverse用于对数组数据的倒序排列
C. 向数组的最后位置加一个新元素,可以用pop方法
D. unshift方法用于向数组删除第一个元素
3. 要将页面的状态栏中显示“已经选中该文本框”,下列JavaScript语句正确的是( A )
A. window.status=”已经选中该文本框”
B. document.status=”已经选中该文本框”
C. window.screen=”已经选中该文本框”
D. document.screen=”已经选中该文本框”
4. 点击页面的按钮,使之打开一个新窗口,加载一个网页,以下JavaScript代码中可行的是( AD )
A. <input type=”button” value=”new”
onclick=”open(‘new.html’, ‘_blank’)”/>
B. <input type=”button” value=”new”
onclick=”window.location=’new.html’;”/>
C. <input type=”button” value=”new”
onclick=”location.assign(‘new.html’);”/>
D. <form target=”_blank”action=”new.html”>
<inputtype=”submit” value=”new”/>
</form>
⑽ web前端求助 题目如下
<html>
<head>
<meta charset="UTF-8"/>
<title></title>
<style type="text/css">
ul li{list-style-type: none;}
ul{width: 500px;float: left;}
li{width: 20%;height: 30px;border: 1px solid #f3f3f3;float: left;box-sizing: border-box;}
li:nth-child(2n-1):hover{background: orange;}
li:nth-child(2n):hover{background: #cf0de3;}
</style>
</head>
<body>
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</body>
</html>