1. 零基础开始学 Web 前端开发，有什么建议吗
一 · 前端零基础入门
从前端基础入门知识学起，掌握基本的HTML+CSS网页布局，以及简单的JS特效，最终可以独立开发出前端PC网页。
二 · 响应式开发与常用框架
使用H5+CSS3实现网页动态特效，通过Bootstrap框架学习，从原生编码过渡到框架使用，更高效的开发出适配各个设备的响应式网页。
三 · 组件化思想开发电商网页
学会H5进阶内容：svg、canvas、H5存储、拖拽上传等，对JS、jQuery进行提升，学习企业开发模式——组件化开发,在企业项目团队中协同合作，实现“高内聚、低耦合”的网页搭建。
四 · 热门框架Vue开发WebApp
学习JS的最新版本ES6，前端流行框架Vue.js， 结合最流行的打包工具Webpack，掌握一个项目上线前的所有开发流程，真正成为一个能够满足企业需求的前端工程师。
2. 如何使用腾讯云函数搭载一个纯HTML+CSS+JS的静态网页
用对象存储加CDN就行了，你用函数计算不容易处理这种有额外CSS和js文件的
3. 用javascript编写一个漂亮的函数计算器。 用HTML构造函数计算器界面，用eval函数实现计算功能。
<script language=javascript>
var yi=function(){bian.value+=yiyi.value}
var er=function(){bian.value+=erer.value}
var san=function(){bian.value+=sansan.value}
var si=function(){bian.value+=sisi.value}
var wu=function(){bian.value+=wuwu.value}
var liu=function(){bian.value+=liuliu.value}
var qi=function(){bian.value+=qiqi.value}
var ba=function(){bian.value+=baba.value}
var jiu=function(){bian.value+=jiujiu.value}
var ling=function(){bian.value+=lingling.value}
var jia=function(){bian.value+=jiajia.value}
var jian=function(){bian.value+=jianjian.value}
var cheng=function(){bian.value+=chengcheng.value}
var chu=function(){bian.value+=chuchu.value}
var qing=function(){bian.value=' '}
var deng=function(){var a=bian.value;var e=eval(a);bian.value=e}
</script>
<table border=2 background=1.jpg cellpadding=1 cellspacing=5>
<tr><td colspan=4> <input type=text size=14 id=bian>
<tr><td><input type=button value='1' id=yiyi onclick=yi()><td><input type=button
value='2' id=erer onclick=er()><td><input type=button value='3' id=sansan
onclick=san()><td><input type=button value='+' id=jiajia onclick=jia()>
<tr><td><input type=button value='4' id=sisi onclick=si()><td><input type=button
value='5' id=wuwu onclick=wu()><td><input type=button value='6' id=liuliu
onclick=liu()><td><input type=button value='-' id=jianjian onclick=jian()>
<tr><td><input type=button value='7' id=qiqi onclick=qi()><td><input type=button
value='8' id=baba onclick=ba()><td><input type=button value='9' id=jiujiu
onclick=jiu()><td><input type=button value='*' id=chengcheng onclick=cheng()>
<tr><td><input type=button value='c' id=qingqing onclick=qing()><td><input
type=button value='0' id=lingling onclick=ling()><td><input type=button value='='
id=dengdeng onclick=deng()><td><input type=button value='/' id=chuchu
onclick=chu()>
</table>
4. 如何用JS创建一个简单的网页计算器
<!doctypehtml>
<html>
<head>
<title>计算器</title>
<metacharset="utf-8"/>
<styletype="text/css">
.panel{
border:4pxsolid#ddd;
width:192px;
margin:100pxauto;
}
.panelp,.panelinput{
font-family:"微软雅黑";
font-size:20px;
margin:4px;
float:left;
}
.panelp{
width:122px;
height:26px;
border:1pxsolid#ddd;
padding:6px;
overflow:hidden;
}
.panelinput{
width:40px;
height:40px;
border:1pxsolid#ddd;
}
</style>
<scripttype="text/javascript">
//参数e用来接收传入的event对象
functioncal(e){
//1.获取事件源，处理button的事件
varobj=e.srcElement||e.target;
if(obj.nodeName!="INPUT"){
return;
}
varvalue=obj.value;
varp=document.getElementById("screen");
if(value=="C"){
//2.如果是[C]，则清空p
p.innerText="";
}elseif(value=="="){
//3.如果是[=]，则运算
varexp=p.innerText;
try{
varresult=eval("("+exp+")");
//如果正确执行，将结果写入p
p.innerText=result;
}catch(e){
//发生错误，给予错误提示
p.innerText="Error.";
}
}else{
//4.如果是其它按钮，则将value追加到p中
p.innerText+=value;
}
}
</script>
</head>
<body>
<!--在最外层的div上注册单击事件，传入event对象，然后在函数中通过event判断出事件来源于哪一个button，
进而做出应有的处理。这样的好处是，避免在button上大量的注册事件。-->
<divclass="panel"onClick="cal(event);">
<div>
<pid="screen"></p>
<inputtype="button"value="C">
<divstyle="clear:both"></div>
</div>
<div>
<inputtype="button"value="7">
<inputtype="button"value="8">
<inputtype="button"value="9">
<inputtype="button"value="/">
<inputtype="button"value="4">
<inputtype="button"value="5">
<inputtype="button"value="6">
<inputtype="button"value="*">
<inputtype="button"value="1">
<inputtype="button"value="2">
<inputtype="button"value="3">
<inputtype="button"value="-">
<inputtype="button"value="0">
<inputtype="button"value=".">
<inputtype="button"value="=">
<inputtype="button"value="+">
<divstyle="clear:both"></div>
</div>
</body>
</html>
这是我自学时候写的计算器
5. 如何设计大型网站的前端 JavaScript 框架
相对大型的项目在前端 JS 方面有几个需要达成的目标：
代码逻辑分层
便于多人协作开发
各部分代码模块化，可以按需加载
保持全局变量的清洁
可进行单元测试
用 GoogleClosure 时对应如下:
1. 代码由底层类库（GoogleClosure）提供，项目代码分为几部分：
常量定义
Helper 方法
项目相关的 UI 组件，如 InPlaceEditor, VoteBar 等
按功能模块划分的 Mole，如 LoginPanel, AnswerList 等
程序入口 main 函数及各大模块(以页面或一组页面划分)入口，如 ProfilePage, HomePage
单元测试：针对UI模块的测试和界面元素呈现测试，可批量执行
2 . 开发人员负责各自模块的开发及测试编写，界面和功能测试（如果涉及异步请求，使用 Mock 对象）全部通过之后与后台联调。
3. 使用 ClosureBuilder 跟据各模块的依赖关系生成 dependency 文件，并分别进行 build（压缩、混淆），每页面根据所属模块引入一至二个 JS 文件
4. 使用 goog.provide() 方法划定命名空间。
5. 使用 GoogleClosure 自带的单元测试工具编写测试用例并调试。
6. 如何给后端程序设计前端页面
后端服务器一般是指servlet容器，用于执行java源程序
常见的网页有html，htm,shtml，asp，aspx，php，jsp等格式
前两个常用于静态网页，后面几个常用于动态网页。
这里前端网页以比较常见的 xx.html 和 xx.jsp 网页作为介绍，其它类似
一、静态页面xx.html如何跟后台交互：
先来看一个最简单的登陆界面源代码
user: password: <input type="submit" value="Submit"/>
</form>12
这是一个表单，我们看到里面都是纯html内容，这是一个静态页面，当我们点击submit按钮时候，浏览器会提交表单内的数据到服务器的loginServlet这个相对地址，我们看看浏览器的地址变成啥了：
这不就是我们的后台servlet的地址嘛，然后这个地址指向的是loginServlet这个servlet，然后在web.xml文件中找到这个servlet关联的java类，从而执行了服务器端的程序（第一次执行，那么会实例化，然后执行里面init()函数，然后执行service（）函数，如果是第二次调用，那么不用实例化了，直接执行service（）函数），我们来看看服务器端的源程序：
package com.atguigu.javaweb;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.Servlet;
import javax.servlet.ServletConfig;
import javax.servlet.ServletContext;
import javax.servlet.ServletException;
import javax.servlet.ServletRequest;
import javax.servlet.ServletResponse;
import javax.servlet.http.HttpServletRequest;
public class loginServlet extends MyGeneriServlet {
public void init(javax.servlet.ServletConfig config) throws ServletException{
super.init(config);
}
public void service(ServletRequest request, ServletResponse response)
throws ServletException, IOException {
//获取请求方式是GET,POST方式？
HttpServletRequest httpServletRequest=(HttpServletRequest) request;
String method=httpServletRequest.getMethod();
System.out.println(method);
//1.获取请求参数：username，password
String username=request.getParameter(“username”);
String password=request.getParameter(“password”);
//获取请求参数
String initUser=getServletContext().getInitParameter(“user”);
String initpassword=getServletContext().getInitParameter(“password”);
PrintWriter out=response.getWriter();
//3.对比
if(initUser.equals(username)&&initpassword.equals(password)){
out.print("Hello"+username); // 生成html内容
}else{
out.print("Sorry"+username); // 生成html内容
}
}12345678
}
上面没有判断此时对servlet的请求是post还是get方法，不过没关系，request这个传进来的参数以及包含了这些信息，自己判断一下执行相应的操作即可
由于页面路径已经跳转到servlet了，但是servlet不是一个.html文件啊，那岂不是没有内容供浏览器显示了，不是的，我们看到返回的参数response中的对象PrintWriter out用于动态生成html内容的字符串"Hello"，所以这时候相当于servlet这个路径也有了html内容了，浏览器的页面就会显示上述字符串了
二、jsp页面如何跟后端服务器交互：
jsp网页文件就是html内容里面插入java代码，当我们访问.jsp网页文件时候，服务器提前已经知道这个页面内含有java代码，那么服务器这边就得先执行一下这些代码（就跟执行servlet的java源代码一样），同时把执行的结果嵌入在当前这个.jsp页面内，我们看看源代码：
<%@page import=“java.util.Date”%> // 如果这个.jsp页面中用到了一些java函数，就得导入库，这就跟java源文件一样的
<% out.println("Hello World！"); // 这里实际上是服务器执行了结果，然后以文本返回给浏览器进行显示 %>
上面红色代码就是java代码，刚刚说过对象PrintWriter out用于动态生成html内容的字符串，所以服务器执行完嵌入在里面的java代码后，就是动态生成了一串html代码，然后一起传给客户端浏览器进行显示
当然这种情况.jsp里面没有按钮，表单这样的控件，现在再来看看有表单这种.jsp如何跟后端交互：
view.jsp
<%@page import=“day03_student.Student”%> // 还是得带入java用到的库文件
学生个人基本信息
<% Student s=(Student)request.getAttribute("students"); // %>
编号 学号 姓名 性别 年龄
<%=s.getId()%> <%=s.getStuno()%> <%=s.getName()%> <%=s.getGender()%> <%=s.getAge() %>
参考的原文：https://blog.csdn.net/myclass1312/article/details/80571867
这时候如果我们直接访问这儿view.jsp文件，应该是没有数据的，因为对象s无法从request对象获取，必须得先给这个request对象赋值才行，即应该从如下servlet路径跳转来view.jsp文件路径才行
public class viewservlet extends HttpServlet {
private StudentDao =new StudentDao();
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
String idstr = request.getParameter("id");
int id = Integer.parseInt(idstr);
//将数据放入request中，传递到页面
Student student=.queryById(id);
request.setAttribute("students", student);
request.getRequestDispatcher("view.jsp").forward(request, response); // 这里是从当前页面跳转去哪个页面，同时传递了request, response这两个参数，这时候的request就是有内容的，接下来的view.jsp页面就能获取到内容而且动态生成html内容
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
this.doGet(request, response);
}123456789101112131415
}
总结：每个xx.html文件,xx.jsp文件，servlet响应程序…都是需要在客户端浏览器通过URL来访问的。
xx.jsp文件，servlet响应程序因为含有java源代码，需要服务器电脑先执行一下，.jsp文件中的java代码一般会动态生成一些html内容嵌入在当前.jsp文件里面一起给浏览器显示出来；而servlet中的java代码一般是数据处理功能的，可能会通过request.getRequestDispatcher(“view.jsp”).forward(request, response);
这样的方式跳转到其它有html内容的页面的URL（同时传递处理好的数据过去） 来显示结果
7. 零基础怎么学web前端
零基础学习web前端，主要有自学和报班学习两种方式。
web前端作为互联网相关的重要岗位，许多互联网大厂（如阿里腾讯等）在招聘时会作出要求。学好web前端对于将来掌握前端后端开发、成为全栈架构师的学习很有帮助。
想学习web前端需要掌握的内容也是不少的，对于自学的同学来说会有一些难度，不推荐自学能力差的人。我们在学习的时候需要分阶段进行，做到有计划的学习与训练，具体的学习顺序如下：
web前端学习顺序：
①计算机基础以及PS基础
②前端开发基础（HTML5开发、JavaScript基础到高级、jQuery网页特效、Bootstrap框架）
③移动开发
④前端高级开发（ECMAScript6、Veu.js框架开发、webpack、前端页面优化、React框架开发、AngularJS 2.0框架开发等）
⑤小程序开发
⑥全栈开发（MySQL数据库、Python编程语言、Django框架等）
⑦就业拓展（网站SEO与前端安全技术）
想要系统学习，你可以考察对比一下开设有IT专业的热门学校，好的学校拥有根据当下企业需求自主研发课程的能力，建议实地考察对比一下。
祝你学有所成，望采纳。