努力的xiaotao
努力的xiaotao

javascript 实现简单计算器

文章目录

    • 效果图：
    • css代码
    • html代码
    • js代码

效果图：

javascript 实现简单计算器_第1张图片

css代码

	body {
		display: flex;
		justify-content: center;
		align-items: center;
		min-height: 100vh;
		background-color: #dcf3f3;
	}
	div{
		margin: auto;
		border: 1px solid orange;
		overflow: hidden;
		font-size: 30px;
		border-radius: 10px;
	}
	.div4:active{
		background-color: pink;
	}
	#div1{
		width: 540px;
	}
	#div2{
		width: 100%;
		height: 90px;
	}
	.div3{
		width: 268px;
		height: 80px;
		line-height: 80px;
		text-align: center;
		float: left;
		background-color: #e5eaff;
		
	}
	.div4{
		width: 113px;
		height: 80px;
		line-height: 80px;
		text-align: center;
		float: left;
		margin: 10px;
		border-radius: 50%;
		background-color: #F0FFFF;
	}
	#txt{
		width: 535px;
		height: 60px;
		border: 1px #E5EAFF;
		text-align: right;
		font-size: 30px;
		display: flex;
		justify-content: center;
		align-items: center;
		background-color: #f6fffb;
	}
	#txtresult{
		width: 535px;
		height: 30px;
		border: 1px #E5EAFF;
		text-align: right;
		font-size: 30px;
		display: flex;
		justify-content: center;
		align-items: center;
		background-color: #f6fffb;
	}
	span{
		display: inline-block;
		width: 100%;
		height: 100%;
        cursor: pointer;
	}

html代码

DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>计算器title>
		<link rel="stylesheet" type="text/css" href="./css/Mystyle.css"/>
		<script src="./js/MyStyle.js" type="text/javascript" charset="utf-8">script>
	head>
	<body>
		<div id="div1">
			<div id="div2">
				<input type="text" readonly="readonly" id="txt"  />
				<input type="text" readonly="readonly" name="" id="txtresult"  />
			div>
			<div class="div3">
				<span id='del'>
					del
				span>
			div>
			<div class="div3">
				<span id='clear'>clearspan>
			div>
			<div class="div4">
				<span id='7'>7span>
			div>
			<div class="div4">
				<span id='8'>8span>
			div>
			<div class="div4">
				<span id='9'>9span>
			div>
			<div class="div4">
				<span id='/'>/span>
			div>
			<div class="div4">
				<span id='4'>4span>
			div>
			<div class="div4">
				<span id='5'>5span>
			div>
			<div class="div4">
				<span id='6'>6span>
			div>
			<div class="div4">
				<span id='*'>*span>
			div>
			<div class="div4">
				<span id='1'>1span>
			div>
			<div class="div4">
				<span id='2'>2span>
			div>
			<div class="div4">
				<span id='3'>3span>
			div>
			<div class="div4">
				<span id='-'>-span>
			div>
			<div class="div4">
				<span id='0'>0span>
			div>
			<div class="div4">
				<span id='.'>.span>
			div>
			<div class="div4">
				<span id='='>=span>
			div>
			<div class="div4">
				<span id='+'>+span>
			div>
		div>
	body>
html>

js代码

window.onload = function(){
	var one = document.getElementById('1');
	var two = document.getElementById('2');
	var there = document.getElementById('3');
	var four = document.getElementById('4');
	var fives = document.getElementById('5');
	var six = document.getElementById('6');
	var Seven = document.getElementById('7');
	var eight = document.getElementById('8');
	var nine = document.getElementById('9');
	var zero = document.getElementById('0');
	var point = document.getElementById('.');
	var chu = document.getElementById('/');
	var cheng = document.getElementById('*');
	var jian = document.getElementById('-');
	var jia = document.getElementById('+');
	var del = document.getElementById('del');
	var clear = document.getElementById('clear');
	var result = document.getElementById('txt');
	var denyu = document.getElementById('=');
	var results = document.getElementById('txtresult');
	one.onclick = function(){
		if(results.value != ''){
			results.value = '';
		}
		result.value = result.value+1;
	}
	two.onclick = function(){
		if(results.value != ''){
			results.value = '';
		}
		result.value = result.value+2;
	}
	there.onclick = function(){
		if(results.value != ''){
			results.value = '';
		}
		result.value = result.value+3;
	}
	four.onclick = function(){
		if(results.value != ''){
			results.value = '';
		}
		result.value = result.value+4;
	}
	fives.onclick = function(){
		if(results.value != ''){
			results.value = '';
		}
		result.value = result.value+5;
	}
	six.onclick = function(){
		if(results.value != ''){
			results.value = '';
		}
		result.value = result.value+6;
	}
	Seven.onclick = function(){
		if(results.value != ''){
			results.value = '';
		}
		result.value = result.value+7;
	}
	eight.onclick = function(){
		if(results.value != ''){
			results.value = '';
		}
		result.value = result.value+8;
	}
	nine.onclick = function(){
		if(results.value != ''){
			results.value = '';
		}
		result.value = result.value+9;
	}
	zero.onclick = function(){
		if(results.value != ''){
			results.value = '';
		}
		result.value = result.value+0;
	}
	point.onclick = function(){
		if(results.value != ''){
			results.value = '';
		}
		//如果用户连续点击运算符，则以最后的为准
		if(result.value.substring(result.value.length-1)=='.'||result.value.substring(result.value.length-1)=='+'||result.value.substring(result.value.length-1)=='-'||result.value.substring(result.value.length-1)=='*'||result.value.substring(result.value.length-1)=='/'){
			result.value = result.value.substring(0,result.value.length-1)+'.';
			return;
		}
		result.value = result.value+'.';
	}
	chu.onclick = function(){
		if(result.value == ''){
			alert('错误！');
			return;
		}
		if(result.value.substring(result.value.length-1)=='.'||result.value.substring(result.value.length-1)=='+'||result.value.substring(result.value.length-1)=='-'||result.value.substring(result.value.length-1)=='*'||result.value.substring(result.value.length-1)=='/'){
			result.value = result.value.substring(0,result.value.length-1)+'/';
			return;
		}
		result.value = result.value+'/';
	}
	cheng.onclick = function(){
		if(result.value == ''){
			alert('错误！');
			return;
		}
		if(result.value.substring(result.value.length-1)=='.'||result.value.substring(result.value.length-1)=='+'||result.value.substring(result.value.length-1)=='-'||result.value.substring(result.value.length-1)=='*'||result.value.substring(result.value.length-1)=='/'){
			result.value = result.value.substring(0,result.value.length-1)+'*';
			return;
		}
		result.value = result.value+'*';
	}
	jian.onclick = function(){
		if(result.value == ''){
			alert('错误！');
			return;
		}
		if(result.value.substring(result.value.length-1)=='.'||result.value.substring(result.value.length-1)=='+'||result.value.substring(result.value.length-1)=='-'||result.value.substring(result.value.length-1)=='*'||result.value.substring(result.value.length-1)=='/'){
			result.value = result.value.substring(0,result.value.length-1)+'-';
			return;
		}
		result.value = result.value+'-';
	}
	jia.onclick = function(){
		if(result.value == ''){
			alert('错误！');
			return;
		}
		if(result.value.substring(result.value.length-1)=='.'||result.value.substring(result.value.length-1)=='+'||result.value.substring(result.value.length-1)=='-'||result.value.substring(result.value.length-1)=='*'||result.value.substring(result.value.length-1)=='/'){
			result.value = result.value.substring(0,result.value.length-1)+'+';
			return;
		}
		result.value = result.value+'+';
	}
	clear.onclick = function(){
		result.value = '';
		results.value = '';
	}
	del.onclick = function(){
		result.value = result.value.substring(0,result.value.length-1);
	}
	denyu.onclick = function(){
		if(result.value == ''){
			alert("温馨提示：请输入操作数！！");
			result.focus();
			return;
		}
		//定义一个变量存储最终结果
		var answer = '';
		//判断
		if(result.value.substring(result.value.length-1)=='.'||result.value.substring(result.value.length-1)=='+'||result.value.substring(result.value.length-1)=='-'||result.value.substring(result.value.length-1)=='*'||result.value.substring(result.value.length-1)=='/'){
			result.focus();
			alert("温馨提示：请输入完整的表达式！！");
			return;
		}
		
		//计算
		var answer = eval(result.value);
		results.value = answer;
		result.value = '';
	}
	
}

你可能感兴趣的:(前端,javascript,css,css3)

  • 使用 Babylon.js 开发时如何通过 CSS 实现 UI 自适应 ttod_qzstudio BabylonJavaScriptBabylon.js
    本文将介绍如何在Babylon.js开发中，通过预先定义的CSS文件实现UI的自适应布局，确保UI能够根据Canvas元素的尺寸动态调整。场景描述假设我们已经使用HTML和CSS构建了Babylon.js的UI界面，并且所有样式都定义在CSS文件中。现在，我们需要让这些UI元素能够根据Canvas的尺寸动态调整，以实现自适应的效果。解决方案1.使用CSS变量（推荐）CSS变量（CustomProp
  • js高阶-响应式原理 silver687 javascript
    在JavaScript中，响应式原理通常是指一种编程模式，它允许开发者创建能够自动响应数据变化的系统或应用。这种模式在现代前端框架（如Vue.js、React等）中非常常见，尤其是在数据绑定和UI更新方面。以下是响应式原理的核心概念和实现方式的详细解释：----1.响应式原理的核心概念响应式编程的核心是数据驱动和自动更新。当数据发生变化时，相关的UI或逻辑会自动更新，而无需手动触发更新操作。这种模
  • 2025年前端发展趋势 贵州数擎科技有限公司 前端javascript
    开发领域：前端开发|AI应用|Web3D|元宇宙技术栈：JavaScript、React、ThreeJs、WebGL、Go经验经验：6年+前端开发经验，专注于图形渲染和AI技术开源项目：github晓智元宇宙、数字孪生引擎、前端面试题大家好！我是[晓智]，一位热爱探索新技术的前端开发者，在这里分享前端和Web3D、AI技术的干货与实战经验。如果你对技术有热情，欢迎关注我的文章，我们一起成长、进步！
  • Flutter使用Ohos原生组件的方法 六号嘉宾 OpenHarmony鸿蒙开发移动开发flutterharmonyos移动开发鸿蒙开发ArkUI跨端开发组件化
    往期学习笔录：鸿蒙（HarmonyOS）北向开发知识点记录~鸿蒙（OpenHarmony）南向开发保姆级知识点汇总~鸿蒙应用开发与鸿蒙系统开发哪个更有前景？嵌入式开发适不适合做鸿蒙南向开发？看完这篇你就了解了~对于大前端开发来说，转鸿蒙开发究竟是福还是祸？鸿蒙岗位需求突增！移动端、PC端、IoT到底该怎么选？记录一场鸿蒙开发岗位面试经历~持续更新中……Flutter中有些功能使用原生组件包装会更简
  • vue项目中导入视频 涔溪 vuevue
    vue项目中引入视频插件一、安装插件vue-video-playernpminstallvue-video-player-s二、在main.js里倒入并使用importVideoPlayerfrom'vue-video-player'import'vue-video-player/src/custom-theme.css'import'video.js/dist/video-js.css'Vue.
  • js能不能清楚浏览器缓存？ 涔溪 jsjavascript缓存开发语言
    JavaScript本身并没有直接清除浏览器缓存的API。但是，你可以使用一些间接的方法来促使浏览器刷新缓存或在某些情况下模拟清除缓存的行为。这里有几个方法：强制刷新页面资源：可以通过为资源链接添加查询字符串的方式（如版本号或时间戳）来确保加载最新的资源，而不是缓存的版本。例如：。使用ServiceWorker：如果你正在使用ServiceWorker来管理缓存，你可以编写代码来控制哪些资源应该被
  • 2024大厂高级前端面试题汇总！ 前端小羽——互联网大厂 前端react.js前端框架
    以下是自己整理的面试题汇总，不敢藏私，统统贡献出来。面试的公司分别是：阿里、网易、滴滴、今日头条、有赞、挖财、沪江、饿了么、携程、喜马拉雅、兑吧、微医、寺库、宝宝树、海康威视、蘑菇街、酷家乐、百分点和海风教育。以下是面试题汇总，前端进阶系列会持续深入更新面试题解，共勉！阿里使用过的koa2中间件koa-body原理介绍自己写过的中间件有没有涉及到Cluster介绍pm2master挂了的话pm2怎
  • javaScript 的语法糖全解 Young丶 vue3jsjavascript开发语言ecmascript
    最近在阅读一些JavaScript代码时，我们发现很多时候可以用更简洁的语法来完成相同的操作，这便是“语法糖”的魅力。语法糖是一种对底层语法的封装和简化，通过编译器将其转换成等价的标准语法来实现。例如，在Java中，泛型和Lambda表达式都是语法糖。泛型在编译过程中会被转换成非泛型的形式，而Lambda表达式会被转换为对应的匿名内部类形式。语法糖的优缺点‌优点‌：‌简洁性‌：语法糖使代码更加简洁
  • 2024最新Web前端经典面试试题及答案-史上最全前端面试题(含答案) 2401_89693619 前端面试职场和发展
    3.阐述清楚浮动的几种方式（常见问题）1.父级div定义height原理：父级div手动定义height，就解决了父级div无法自动获取到高度的问题。优点：简单、代码少、容易掌握缺点：只适合高度固定的布局，要给出精确的高度，如果高度和父级div不一样时，会产生问题2.父级div定义overflow:hidden原理：必须定义width或zoom:1，同时不能定义height，使用overflow:
  • 2024Web前端人事面试题总结精选_前端面试项目相关提问 2401_86638424 面试职场和发展
    api然后我们前端直接调用，当然如果后台还没写好就先自己造假数据来完成。平常都是用webpack来构建项目等等。2、你觉得你个性上最大的优点是什么？回答提示：沉着冷静、条理清楚、立场坚定、顽强向上、乐于助人和关心他人、适应能力和幽默感、乐观和友爱。3、说你最大的缺点？回答提示：这个问题企业问的概率很大，通常不希望听到直接回答的缺点是什么等，如果求职者说自己小心眼、爱忌妒人、非常懒、脾气大、工作效率
  • 【华为OD】| 最多获得的短信条数、云短 信平台优惠活动_完全背包 buff会技术的程序媛 -JS】技术杂谈技术learn算法java
    目录一.题目描述二.输入描述三.输出描述用例四.题目解析五.Java玩法六.JavaScript玩法一.题目描述某云短信厂商，为庆祝国庆，推出充值优惠活动。现在给出客户预算，和优惠售价序列，求最多可获得的短信总条数。二.输入描述第一行客户预算M，其中0<=M<=10^6第二行给出售价表，P1,P2,…Pn,其中1<=n<=100Pi为充值i元获得的短信条数。1<=Pi<=1000,1<=n<=10
  • 2025年前端面试题汇总 涔溪 前端
    JavaScript核心异步编程Promise、async/await的工作原理及应用场景。如何处理并发请求，使用Promise.all()或Promise.race()等方法。解释事件循环机制，理解微任务（microtask）与宏任务（macrotask）的区别。原型链深入理解JavaScript中的原型继承模型。举例说明如何通过修改原型对象影响所有实例。闭包定义闭包及其作用，如实现私有变量和函
  • 游戏策划的分类 yaoyaoyao可爱呀 游戏策划
    P3游戏策划分类1.程序2.美术3.策划程序：一般分为客户端程序和服务器程序客户端程序一般负责游戏的前端画面表现服务器程序负责游戏的后端运算美术：角色原画，角色模型动作，场景原画，场景模型，UI设计，特效设计程序，美术，运营项目经理：给各个岗位同事安排工作计划，推进项目进度策划：主策划（4—5年）对游戏的设计进行统筹的规划和管理对工作进行分配和验收系统策划：游戏玩法和系统设计数值策划：游戏玩家的血
  • 云原生架构下的AI智能编排：ScriptEcho赋能前端开发 前端
    在当今快速发展的数字经济时代，云原生架构已成为构建现代化应用的关键。它通过微服务、容器化和DevOps等技术，实现了应用的高可用性、可扩展性和弹性。然而，在云原生架构下，前端开发也面临着新的挑战。为了应对这些挑战，AI写代码工具（例如ScriptEcho）应运而生，通过AI智能编排，显著提升了前端开发效率。本文将深入探讨AI智能编排在云原生架构中的作用，并以ScriptEcho为例，阐述其如何加速
  • java ssm基于微信小程序的小说图书阅读系统网上书城论坛交流（源码+文档+运行视频+讲解视频） QQ2279239102 SSM微信小程序java微信小程序开发语言SSMvue.js
    文章目录系列文章目录目的前言一、详细视频演示二、项目部分实现截图三、技术栈后端框架SSM前端框架vueSSM框架详细介绍系统测试微信小程序介绍四、代码参考源码获取目的摘要：基于JavaSsm与微信小程序的小说图书阅读系统，为书虫打造沉浸式阅读天地，兼设论坛交流，丰富阅读体验，促进文学交流。网上书城汇聚海量小说、图书，分类精细，搜索便捷，用户通过微信小程序阅读，支持字体、背景调节，书签、笔记功能方便
  • Java前端基础—HTML 缺少动力的火车 前端基础集合前端javahtml
    Java前端基础—HTML目录Java前端基础—HTML1.简介2.基础语法2.1HTML页面固定结构2.2标题标签2.3段落标签2.4换行标签2.5水平线标签2.6文本标签2.7图片标签2.8音频标签2.9视频标签2.10链接标签2.11列表标签2.12表格标签2.13表单标签2.14语义标签1.简介1.网页组成：文字，图片，音频，视频，超链接。2.代码如何转换成网页：依靠的是浏览器的渲染和解析
  • 一个可以根据题目得分显示不同题目的答题demo qq_41759752 javascripthtml5vue.js前端
    前段时间有幸参与到一个全国性的某心理健康测评平台的开发工作，其答题部分的前端开发工作由我完成，现将该平台前端的主要交互逻辑重新实现做成demo，有需要的小伙伴或客户可以联系我获取了，有类似开发需求的老板和可以联系我哟。其中主要实现的交互有：1、在excel录入题目信息，后台写脚本将excel数据转化为前端页面需要的试题数据，前端通过接口拿到所有的试题数据。（后台操作，demo中数据写成了静态数据）
  • clang和gcc对比 三雷科技 深入C++编程入门开发语言c++cclangllvmgcc
    clang和gcc对比一、基本概述二、背景与历史三、架构与模块化四、错误提示与静态分析五、性能与编译速度六、兼容性与多平台支持七、调试支持Clang和GCC都是广泛使用的C、C++编译器，它们各自具有独特的优势和特点，适用于不同的使用场景。以下是对两者的详细对比：一、基本概述ClangGCC定义一个C/C++、Objective-C/Objective-C++编程语言的编译器前端，采用底层虚拟机（
  • 一文大白话讲清楚webpack基本使用——8——开发环境和生产环境的配置和区别 16年上任的CTO webpackwebpack前端node.jswebpack开发环境webpack生产环境
    一文大白话讲清楚webpack基本使用——8——开发环境和生产环境的配置和区别1.建议按文章顺序从头看，一看到底，豁然开朗第一篇：一文大白话讲清楚啥是个webpack第二篇：一文大白话讲清楚webpack基本使用——1——完成webpack的初步构建第三篇一文大白话讲清楚webpack基本使用——2——css相关loader的配置和使用第四篇一文大白话讲清楚webpack基本使用——3——图像相关
  • 全网最详细Gradio教程系列5——Gradio Client: javascript 龙焰智能 Gradio全解教程javascriptgradioclientplaycode.conpmcdnnode.js
    全网最详细Gradio教程系列5——GradioClient:javascript前言本篇摘要5.GradioClient的三种使用方式5.2使用GradioJavaScriptClient5.2.1安装1.npm方式：node.js2.CDN方式3.在线运行环境：PLAYCODE5.2.2连接到Gradio程序1.通过URL或SpaceID连接2.辅助：duplicate()和hf_token5
  • 大前端|如何突破动态化容器的天花板? 思维导图-java架构 用心去追梦 前端java架构
    突破动态化容器的天花板是现代Web开发和移动应用开发中一个重要的挑战，尤其是在大前端（包括Web端和移动端）领域。动态化容器允许内容在不同设备、屏幕尺寸和网络条件下自适应地显示。为了帮助理解如何克服这一挑战，我们可以构建一个思维导图，该思维导图从Java架构师的角度出发，涵盖了关键技术点和策略。突破动态化容器的天花板│├───概述│├───定义与重要性││└───动态化容器的意义及其对用户体验的影
  • Webpack、Vite区别知多少？ brrdg_sefg webpack前端node.js
    前端的项目打包，我们常用的构建工具有Webpack和Vite，那么Webpack和Vite是两种不同的前端构建工具,那么你们又是否了解它们的区别呢？我们在做项目时要如何选择呢？一、工具定义1、Webpack：是一个强大的静态模块打包工具，它可以将各种类型的文件，如JavaScript、CSS、图片等，作为模块进行打包，并生成最终的静态资源文件。Webpack使用各种loader和plugin来处理
  • 基于 Github Actions 和 Docker 的前端项目CI/CD Single 部署打包githubdocker前端ci/cd
    一、项目背景最近在写一个管理系统项目的时候出现了一些比较麻烦的问题，由于进度比较赶，项目虽然上线了，但是还需要继续开发，这就涉及到频繁的构建和部署。首先讲一下没使用CI/CD之前的部署方式:首先使用pnpmbuild，拿到项目的打包产物.output文件夹将.output文件夹压缩，并通过服务器可视化工具宝塔，将压缩包上传到指定文件夹下第一次部署时使用pm2命令pm2start./.output/
  • AI写代码工具：程序员的效率利器与职业发展新机遇 前端
    在如今竞争激烈的职业环境中，个人职业发展至关重要。提升工作效率，专注于核心竞争力，已成为每位职场人士，特别是程序员的共同追求。而随着人工智能技术的飞速发展，各种AI写代码工具应运而生，为程序员们提供了前所未有的效率提升和职业发展新机遇。本文将深入探讨AI代码生成工具如何帮助程序员提升效率，掌握新技术，并最终促进职业发展。提升效率，专注核心竞争力程序员的工作常常涉及大量重复性的代码编写，例如前端页面
  • AI写代码工具：ScriptEcho助力前端开发培训 前端
    引言在当今数字化迅速发展的时代，编程培训的重要性愈发凸显。无论是初学者还是资深开发者，都需要不断更新自己的知识，以应对技术迭代带来的挑战。而在前端开发领域，开发者们面临着诸多挑战，包括日益复杂的项目需求和不断更新的技术栈。为了提高开发效率，减轻开发者的负担，AI写代码工具应运而生，其中，ScriptEcho作为一款前沿的AI编程助手，正在改变这一领域的游戏规则。前端开发的现状传统开发流程的复杂性传
  • Css3 3D转换 黄丫丫07 css33dcss
    特点：近大远小物体后面遮挡不可见三维坐标系：三维坐标系其实就是指立体空间，立体空间是由3个轴共同组成的。X轴：水平向右为正Y轴：垂直向下为正Z轴：垂直屏幕向外为正3D位移和3D旋转：主要知识点：3D位移：translate3d（x,y,z）3D旋转：rotate3d(x,y,z)透视：perspective3D呈现transform-style3D位移：translate3d（x,y,z）:Tra
  • CSS3 2D 转换介绍 半点寒12W csscss3css前端
    CSS3中的2D转换（2DTransforms）允许你在二维平面上对元素进行操作，如移动、旋转、缩放和倾斜等，这可以让网页的布局和动画效果更加丰富多样。以下是一些主要的2D转换方法：一、translate（移动）语法：transform:translate(x,y);或者transform:translateX(x);和transform:translateY(y);。其中x和y是长度值（可以是像
  • HTML＜center＞标签 新生派 html前端
    HTML5不支持。标签在HTML4中用于使文本居中对齐。用什么来代替呢？例子居中对齐文本（使用CSS）：h1{text-align:center;}p{text-align:center;}div{text-align:center;}ThisisaheadingThisisaparagraph.Thisisadiv.
  • css3过渡总结 半点寒12W csscss3前端css
    一、过渡的定义与作用CSS3过渡（Transitions）允许CSS属性在一定的时间区间内平滑地过渡，从一个值转变为另一个值。它能够让网页元素的状态变化更加自然、流畅，给用户带来更好的视觉体验。例如，当一个元素从隐藏状态变为显示状态，通过过渡可以使其淡入，而不是生硬地突然出现。二、过渡的属性transition-property（过渡属性）该属性用于指定哪些CSS属性会产生过渡效果。它可以是单个属
  • 大三学生面试经历（2） 无限大. 面试面试职场和发展
    继续昨天的内容，我面试的是一个Java实习岗，但是居然也问了我前端（vue）相关的问题最大的感觉就是，现在真的越来越卷了，后端都把前端的东西卷完了，当时是线上面试，感觉答的不太好（因为确实没准备的太全），接下来的时间继续加强加强这些方面的学习愿与诸君共勉！具体如下1.请简述Vue.js的生命周期函数及其执行顺序2.Vue.js中的v-bind指令和v-model指令有什么区别?3.请简述Vue.j
  • 强大的销售团队背后 竟然是大数据分析的身影 蓝儿唯美 数据分析
    Mark Roberge是HubSpot的首席财务官，在招聘销售职位时使用了大量数据分析。但是科技并没有挤走直觉。 大家都知道数理学家实际上已经渗透到了各行各业。这些热衷数据的人们通过处理数据理解商业流程的各个方面，以重组弱点，增强优势。 Mark Roberge是美国HubSpot公司的首席财务官，HubSpot公司在构架集客营销现象方面出过一份力——因此他也是一位数理学家。他使用数据分析
  • Haproxy+Keepalived高可用双机单活 bylijinnan 负载均衡keepalivedhaproxy高可用
    我们的应用MyApp不支持集群，但要求双机单活（两台机器：master和slave）： 1.正常情况下，只有master启动MyApp并提供服务 2.当master发生故障时，slave自动启动本机的MyApp，同时虚拟IP漂移至slave，保持对外提供服务的IP和端口不变 F5据说也能满足上面的需求，但F5的通常用法都是双机双活，单活的话还没研究过 服务器资源 10.7
  • eclipse编辑器中文乱码问题解决 0624chenhong eclipse乱码
    使用Eclipse编辑文件经常出现中文乱码或者文件中有中文不能保存的问题，Eclipse提供了灵活的设置文件编码格式的选项，我们可以通过设置编码 格式解决乱码问题。在Eclipse可以从几个层面设置编码格式：Workspace、Project、Content Type、File 本文以Eclipse 3.3（英文）为例加以说明： 1. 设置Workspace的编码格式： Windows-&g
  • 基础篇--resources资源 不懂事的小屁孩 android
    最近一直在做java开发，偶尔敲点android代码，突然发现有些基础给忘记了，今天用半天时间温顾一下resources的资源。 String.xml    字符串资源   涉及国际化问题  http://www.2cto.com/kf/201302/190394.html   string-array
  • 接上篇补上window平台自动上传证书文件的批处理问卷 酷的飞上天空 window
    @echo off : host=服务器证书域名或ip，需要和部署时服务器的域名或ip一致 ou=公司名称, o=公司名称 set host=localhost set ou=localhost set o=localhost set password=123456 set validity=3650 set salias=s
  • 企业物联网大潮涌动：如何做好准备？ 蓝儿唯美 企业
    物联网的可能性也许是无限的。要找出架构师可以做好准备的领域然后利用日益连接的世界。 尽管物联网（IoT）还很新，企业架构师现在也应该为一个连接更加紧密的未来做好计划，而不是跟上闸门被打开后的集成挑战。“问题不在于物联网正在进入哪些领域，而是哪些地方物联网没有在企业推进，” Gartner研究总监Mike Walker说。 Gartner预测到2020年物联网设备安装量将达260亿，这些设备在全
  • spring学习——数据库（mybatis持久化框架配置） a-john mybatis
    Spring提供了一组数据访问框架，集成了多种数据访问技术。无论是JDBC，iBATIS(mybatis)还是Hibernate，Spring都能够帮助消除持久化代码中单调枯燥的数据访问逻辑。可以依赖Spring来处理底层的数据访问。 mybatis是一种Spring持久化框架，要使用mybatis，就要做好相应的配置： 1，配置数据源。有很多数据源可以选择，如：DBCP，JDBC，aliba
  • Java静态代理、动态代理实例 aijuans Java静态代理
    采用Java代理模式，代理类通过调用委托类对象的方法，来提供特定的服务。委托类需要实现一个业务接口，代理类返回委托类的实例接口对象。 按照代理类的创建时期，可以分为：静态代理和动态代理。 所谓静态代理：　指程序员创建好代理类，编译时直接生成代理类的字节码文件。 所谓动态代理：　在程序运行时，通过反射机制动态生成代理类。   一、静态代理类实例： 1、Serivce.ja
  • Struts1与Struts2的12点区别 asia007 Struts1与Struts2
    1) 在Action实现类方面的对比：Struts 1要求Action类继承一个抽象基类；Struts 1的一个具体问题是使用抽象类编程而不是接口。Struts 2 Action类可以实现一个Action接口，也可以实现其他接口，使可选和定制的服务成为可能。Struts 2提供一个ActionSupport基类去实现常用的接口。即使Action接口不是必须实现的，只有一个包含execute方法的P
  • 初学者要多看看帮助文档 不要用js来写Jquery的代码 百合不是茶 jqueryjs
    解析json数据的时候需要将解析的数据写到文本框中,  出现了用js来写Jquery代码的问题;   1, JQuery的赋值  有问题    代码如下: data.username 表示的是:  网易            $("#use
  • 经理怎么和员工搞好关系和信任 bijian1013 团队项目管理管理
            产品经理应该有坚实的专业基础，这里的基础包括产品方向和产品策略的把握，包括设计，也包括对技术的理解和见识，对运营和市场的敏感，以及良好的沟通和协作能力。换言之，既然是产品经理，整个产品的方方面面都应该能摸得出门道。这也不懂那也不懂，如何让人信服？如何让自己懂？就是不断学习，不仅仅从书本中，更从平时和各种角色的沟通
  • 如何为rich:tree不同类型节点设置右键菜单 sunjing contextMenutreeRichfaces
    组合使用target和targetSelector就可以啦，如下： <rich:tree id="ruleTree" value="#{treeAction.ruleTree}" var="node" nodeType="#{node.type}" selectionChangeListener=&qu
  • 【Redis二】Redis2.8.17搭建主从复制环境 bit1129 redis
    开始使用Redis2.8.17 Redis第一篇在Redis2.4.5上搭建主从复制环境，对它的主从复制的工作机制，真正的惊呆了。不知道Redis2.8.17的主从复制机制是怎样的，Redis到了2.4.5这个版本，主从复制还做成那样，Impossible is nothing! 本篇把主从复制环境再搭一遍看看效果，这次在Unbuntu上用官方支持的版本。   Ubuntu上安装Red
  • JSONObject转换JSON--将Date转换为指定格式 白糖_ JSONObject
    项目中，经常会用JSONObject插件将JavaBean或List<JavaBean>转换为JSON格式的字符串，而JavaBean的属性有时候会有java.util.Date这个类型的时间对象，这时JSONObject默认会将Date属性转换成这样的格式：   {"nanos":0,"time":-27076233600000,
  • JavaScript语言精粹读书笔记 braveCS JavaScript
    【经典用法】：   //①定义新方法 Function .prototype.method=function(name, func){ this.prototype[name]=func; return this; } //②给Object增加一个create方法，这个方法创建一个使用原对
  • 编程之美-找符合条件的整数 用字符串来表示大整数避免溢出 bylijinnan 编程之美
    import java.util.LinkedList; public class FindInteger { /** * 编程之美 找符合条件的整数 用字符串来表示大整数避免溢出 * 题目：任意给定一个正整数N，求一个最小的正整数M(M>1)，使得N*M的十进制表示形式里只含有1和0 * * 假设当前正在搜索由0，1组成的K位十进制数
  • 读书笔记 chengxuyuancsdn 读书笔记
    1、Struts访问资源 2、把静态参数传递给一个动作 3、<result>type属性 4、s:iterator、s:if c:forEach 5、StringBuilder和StringBuffer 6、spring配置拦截器 1、访问资源 (1)通过ServletActionContext对象和实现ServletContextAware,ServletReque
  • [通讯与电力]光网城市建设的一些问题 comsci 问题
          信号防护的问题,前面已经说过了,这里要说光网交换机与市电保障的关系       我们过去用的ADSL线路,因为是电话线,在小区和街道电力中断的情况下,只要在家里用笔记本电脑+蓄电池,连接ADSL,同样可以上网........     
  • oracle 空间RESUMABLE daizj oracle空间不足RESUMABLE错误挂起
    空间RESUMABLE操作  转 Oracle从9i开始引入这个功能，当出现空间不足等相关的错误时，Oracle可以不是马上返回错误信息，并回滚当前的操作，而是将操作挂起，直到挂起时间超过RESUMABLE TIMEOUT，或者空间不足的错误被解决。 这一篇简单介绍空间RESUMABLE的例子。 第一次碰到这个特性是在一次安装9i数据库的过程中，在利用D
  • 重构第一次写的线程池 dieslrae 线程池 python
    最近没有什么学习欲望,修改之前的线程池的计划一直搁置,这几天比较闲,还是做了一次重构,由之前的2个类拆分为现在的4个类. 1、首先是工作线程类:TaskThread,此类为一个工作线程,用于完成一个工作任务,提供等待(wait),继续(proceed),绑定任务(bindTask)等方法 #!/usr/bin/env python # -*- coding:utf8 -*-
  • C语言学习六指针 dcj3sjt126com c
    初识指针，简单示例程序： /* 指针就是地址，地址就是指针 地址就是内存单元的编号 指针变量是存放地址的变量 指针和指针变量是两个不同的概念 但是要注意： 通常我们叙述时会把指针变量简称为指针，实际它们含义并不一样 */ # include <stdio.h> int main(void) { int * p; // p是变量的名字， int *
  • yii2 beforeSave afterSave beforeDelete dcj3sjt126com delete
    public function afterSave($insert, $changedAttributes) { parent::afterSave($insert, $changedAttributes); if($insert) { //这里是新增数据 } else { //这里是更新数据 } }  
  • timertask shuizhaosi888 timertask
    java.util.Timer timer = new java.util.Timer(true); // true 说明这个timer以daemon方式运行（优先级低， // 程序结束timer也自动结束），注意，javax.swing // 包中也有一个Timer类，如果import中用到swing包， // 要注意名字的冲突。 TimerTask task = new
  • Spring Security（13）——session管理 234390216 sessionSpring Security攻击保护超时
    session管理 目录   1.1     检测session超时 1.2     concurrency-control 1.3     session 固定攻击保护         
  • 公司项目NODEJS实践0.3[ mongo / session ...] 逐行分析JS源代码 mongodbsessionnodejs
        http://www.upopen.cn   一、前言         书接上回，我们搭建了WEB服务端路由、模板等功能，完成了register 通过ajax与后端的通信，今天主要完成数据与mongodb的存取，实现注册 / 登录 /
  • pojo.vo.po.domain区别 LiaoJuncai javaVOPOJOjavabeandomain
    　　POJO = "Plain Old Java Object"，是MartinFowler等发明的一个术语，用来表示普通的Java对象，不是JavaBean, EntityBean 或者 SessionBean。POJO不但当任何特殊的角色，也不实现任何特殊的Java框架的接口如，EJB， JDBC等等。 　　 　　即POJO是一个简单的普通的Java对象，它包含业务逻辑
  • Windows Error Code OhMyCC windows
    0 操作成功完成. 1 功能错误. 2 系统找不到指定的文件. 3 系统找不到指定的路径. 4 系统无法打开文件. 5 拒绝访问. 6 句柄无效. 7 存储控制块被损坏. 8 存储空间不足, 无法处理此命令. 9 存储控制块地址无效. 10 环境错误. 11 试图加载格式错误的程序. 12 访问码无效. 13 数据无效. 14 存储器不足, 无法完成此操作. 15 系
  • 在storm集群环境下发布Topology roadrunners 集群stormtopologyspoutbolt
    storm的topology设计和开发就略过了。本章主要来说说如何在storm的集群环境中，通过storm的管理命令来发布和管理集群中的topology。   1、打包 打包插件是使用maven提供的maven-shade-plugin，详细见maven-shade-plugin。 <plugin> <groupId>org.apache.maven.
  • 为什么不允许代码里出现“魔数” tomcat_oracle java
    　　在一个新项目中，我最先做的事情之一，就是建立使用诸如Checkstyle和Findbugs之类工具的准则。目的是制定一些代码规范，以及避免通过静态代码分析就能够检测到的bug。 　　迟早会有人给出案例说这样太离谱了。其中的一个案例是Checkstyle的魔数检查。它会对任何没有定义常量就使用的数字字面量给出警告，除了-1、0、1和2。 　　很多开发者在这个检查方面都有问题，这可以从结果
  • zoj 3511 Cake Robbery(线段树) 阿尔萨斯 线段树
    题目链接：zoj 3511 Cake Robbery 题目大意：就是有一个N边形的蛋糕，切M刀，从中挑选一块边数最多的，保证没有两条边重叠。 解题思路：有多少个顶点即为有多少条边，所以直接按照切刀切掉点的个数排序，然后用线段树维护剩下的还有哪些点。 #include <cstdio> #include <cstring> #include <vector&
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他