❶ 前端的数据，后台一般怎么更新前端数据
前端的数据如果都是从后端请求过来的话， 后端直接更新数据就行了 ，一般来说后端的数据都是保存在数据库中的（比如Oracle、Mysql），直接使用sql语句在数据库中改对应的数据就可以了。
❷ 怎么使用 JavaScript 将网站后台的数据变化实时更新到前端
要实现这个功能，要用到ajax获取后端数据，和前端js定时器的知识，
首先自定义一个ajax获取要显示在html页面上的数据的方法，例如方法getdata,这个方法把获取的返回值，通过js动态的显示到html页面要显示的区域，然后再写一个js定时器来实现实时调用数据，如：
<script>
//定时器 异步运行
function hello(){
alert("hello");
}
var t2 = window.setTimeout("hello()",3000); //定时器
//window.clearTimeout(t2);//去掉定时器
</script>
把里面的hello方法换成你ajax获取数据的方法名，然后改下定时器里面的方法名和时间，这里设置的是3秒钟执行一次可以设置成你自己要的数据，就实现了你要的页面实时调用数据了。
❸ 前端用d3.js绘图如何做到数据实时更新到界面
你可以看看这个，网页链接
❹ mysqk前端里怎样更新数据库
数据方法 有好几种 我比较喜欢 用excel然后 在导到数据库里，具体怎么弄网上很多方法， 如果多到几百条 要自己手打的。再多就是体力活了
❺ 怎么使用 JavaScript 将网站后台的数据变化实时更新到前端
实时这个工作现在大体有两种方法
一、前端不断地向后台轮询请求数据查询的接口(不管你是用AJAX还是什么)然后将返回的数据重绘在页面上，这以前端页面为主动的方式。
二、如果浏览器支持Websocket 那么在后台建立一个websocket服务器，与前端页面建立websocket连接，进行从后台到前端的推送，前端接到推送数据后，将数据重绘在页面上。
❻ js怎么实现及时更新数据库的数据展现在前台页面
页面本身是不具备保存历史数据的功能的，需要借助其它手段来实现，常用方法如下：
异步更新页面。这种方法实际上页面是没有刷新的，通过AJAX导步获取信息来更新页面，这样可以保留原页面需要保留的数据。一些网站的发表评论后，评论内容更新，用的就是这个方法。
使用COOKIE保存。把需要保存的数据存储到COOKIE中，页面更新时，读取COOKIE渲染到页面上。比较常见的如：登录框记录用户名，下次登录无须重新输入。但COOKIE存储的数据量有限，不适合大的数据存储。
服务器端保存数据。与COOKIE保存类似，只不过内容是保存在服务器端，利用会话机制在页面更新时从服务器读取内容重新渲染。这是一种常见的而保险的方法。像一些文本编辑器，保存草稿等，就是通过这样的方式实现的
❼ c/s架构为什么后端更新前端要强制更新
因为该架构服务器负责数据的管理，客户机负责完成与用户的交互任务。每次更新意味着客户端的布局有所调整，需要根据更改计划调整端口传输。
❽ 写给产品经理之前端是如何展示后端数据的
移动互联网的迅猛发展让移动APP呈现出爆发之势，这两年更是移动开发程序员的春天。
今天的互联网上充斥着产品与技术的撕逼。也许你会问产品经理到底要不要懂技术？由此引申出，产品经理到底要不要懂设计？产品经理到底要不要懂运营？产品经理到底要不要懂市场？产品经理到底要不要懂业务？这所有问题的来源都是大家对于产品经理的工作认识不一致。
每个人心中都有一个产品经理的定义，产品经理在技术方面更多的是去统筹和规划。不是画画图写写文档就可以了。这里面更多的需要的是对逻辑的梳理和拆分。
例如很简单的一个app内嵌发红包的活动，产品经理需要确定整个活动的流程。从用户进入页面的那一瞬间就应该被产品经理掌控。他的每一个步骤，每一个操作会带来什么结果，有哪些变量会导致活动进程失败，这些都要产品去考虑。等到活动逻辑和过程全部梳理完成，下面就要进行拆分了。还是以发红包为例，红包中金额是客户端写死还是服务端进行计算，红包领取资格需要服务端返回几种结果，每种结果对应客户端的提示是什么，用户领取红包以后服务端需要记录那些信息（帐号，uid，领取时间，金额，是否使用等），客户端哪些地方需要加入计数器进行数据统计。总结起来其实就是，产品经理需要根据开发的每一个环节，将所有内容分类整理，并分发给不同部分的开发进行研发。最后，还需要给测试准备好check list，当测试按照check list测试完成以后，才可以上线。
以上种种都需要产品对前端如何显示后端数据有一个清晰的认识才能规划好数据如何展示。是APP写死呢还是后台返回，在用户任务进行的时候有哪些可能case。只有搞清楚这些，产品才能在实际的开发中掌握好整个项目的流程与进展，才能不被开发给糊弄。
简单的说，前端仅仅将后端返回的数据展示在页面上，不做过多的逻辑处理。前端需要关心的是，数据如何更好的展示出来，页面效果如何做出来，以及其性能问题。
而后端就是负责对这些数据进行处理，提供给前端展示。
前端一般有H5、android、ios等多端界面。数据不要轻易写死在前端里面，不然到时候三端都要修改，费时费力。而将这些变化多数据让后端进行处理，前端将这个数据取出来显示出来就行了。
举个例子吧，下图是一个美团app首页团购的展示效果
上方美食等8个icon一般为固定展示栏目，非特殊情况不会修改。那么前端一般是写死在app中，等到需要更新的时候更新app即可。
而下方猜你喜欢是一个列表，该列表数据经常变化，数据写在服务端维护，app取出数据进行展示即可。
首先，前段对页面的展示是分两步走的。
第一、在本地绘制好界面，当然此时未连api会填充一些假数据，或写一些默认值。
第二、连api进行数据获取，将数据填充进界面。
既然如此，咱们简单看下前端拿到的数据到底长什么样的吧。
现在前端获取到的数据基本是json数据。
不需要特别懂里面每一个的含义，只需要知道，前端通过"title"这个键名(key)就可以拿到"合辑护甲"这个值(value)。 "title": "合辑护甲" 这一整个就是俗称的一个字段。通过该字段前端就可以获取到列表的标题了。当然这个列表只是简单的展示用，还有诸如图片地址、优惠信息、已售份额等信息没有提供，这就是缺少字段的情况。
前后端就是通过这样的一个定义获取/传递数据的。
考虑到后期拓展、需求变更等，一般来说，涉及到计算的、可能有变动的，一律不要让前端来弄。
还是刚才那个例子，在刚才那个列表中有一个“立减5元”的橙黄色tag。
这个tag信息，如果考虑不充分，比如说，后端只提供一个数字5，然后前端在其页面写死“立减x元”，x为填入后端提供的数字，颜色固定为橙黄色。这个如果需求不修改还好，如果后期需要新增一个“满20减5元”的红色tag不傻眼了吗？
到时候只能通过升级app来解决，而且不升级的老用户将永远看不到这个红色的tag。
所以说，考虑到程序的可复用和拓展性，需要产品将后期可能新增或变更的需求考虑好，和前后端进行沟通，让前后端设计好实现，尽量降低程序的耦合和硬编码。这才能使一个产品更加健壮以及让苦逼的程序猿少加班的关键。
那么刚才那个tag的需求如何设计才合理呢？
首先是tag显示文字，全权由后端提供，可以是多个字段，由前端进行拼接。然后是tag的颜色，提供几种样式让前端判断是一种可行的办法，但是直接提供tag的色值给前端的这种方式无疑给前端展示增加了无限的可能。
是不是也要增加一个tag形状的字段呢？
俗话说，过犹不及。tag形状这种东西真的很少变更，字段太多无疑会增加开发的时间成本，而且会让人有一种舍本逐末之感。
前端获取到后端数据后，如果前端不主动刷新重新请求数据的话，这个页面的数据在该页面销毁前会一直保持不变。
如何理解？
首先，第一次进入一个页面，该页面数据为空或默认数据。此时前端会链接api请求数据。数据请求完成后，填充进页面。那么本次联网请求就完成了，在前端不进行二次数据请求之前，该页面会一直保持本次请求的数据。也就是说，就算服务端修改了数据，前端此时是不能事实的进行更新的，因为我前端不知道你数据更新了。
那么在这个需要实时更新页面数据的时候和前端讲这种需求会被前端直接回绝：“做不了”。这个时候产品咋办，怪怪妥协？最后背锅的还是自己，而且自己也不知道是真做不了还是假做不了。
实时刷新也不是不能做，只是做的成本略高，需要和后端进行配合，像微信聊天一样和后端进行长连接(socket)，这样服务端数据变更前端就知道数据变更了。
当然如果稍懂页面刷新机制的话，可以要求前端在适当的时机进行页面刷新，如在页面可见的时候进行刷新，这样用户每次看到的都是最新的数据。也可以让用户主动刷新，如新增刷新功能。
产品懂技术这件事情，不仅会降低和开发同学沟通时的难度和被歧视风险，还会提升在面对开发同学意见时的判断力，会降低被技术团队忽悠的几率。同时，在需要向上级解释技术原因导致变更的情况下，也会有助于说服老板。
“闻道有先后，术业有专攻”，要相信自己所接触的开发团队是专业的，靠谱的，相信开发团队为实现需求所做出的技术方案是合理的，最优的。如果有质疑，可以加深沟通，以合适的方式提出自己的质疑。这里要补充一句的是，这个信任过程是需要建立的，也是会根据团队的表现不断变化的；同理，其实团队对于产品经理的信任度也是一样的情况。
吐槽是没有意义的，关键还是要解决问题。如果觉得产品经理不靠谱，那么有没有进行过深入的沟通？如果觉得开发不好沟通，那么有没有进行过了解，不好沟通的原因在哪里？如果当事人本身确实不可沟通，那么有没有考虑和对方的老板沟通，或者通过自己的老板如实反映情况？吐槽是最容易的，解决问题反而会很难。
❾ 几个有效的前端数据处理的方法
一、JSON对象过滤数据（处理复杂数据时可以直接在内部过滤掉）
封装方法：
function getTargetObject(targetObject, propsArray){if(typeof(targetObject) !=="object"|| !Array.isArray(propsArray)) {thrownewError("参数格式不正确"); }constresult = {};Object.keys(targetObject).filter(key=>propsArray.includes(key)).forEach(key=>{ result[key] = targetObject[key]; })returnresult;}
使用方法：
let arr = {a: '1', b:'2', c: '3'}
getTargetObject(arr, ['a', 'b'])
引用网站： https://segmentfault.com/q/1010000016133960/a-1020000016134570
二、数组切割（当后端传来数据过多的时候，将数据切成几个等分，用户下拉的时候再展示）
* 将一个数组分成几个同等长度的数组 * array[分割的原数组] * size[每个子数组的长度]
*/functionsliceArray(array, size) {
varresult = [];
for(varx = 0; x < Math.ceil(array.length / size); x++) {
varstart = x * size;
varend = start + size;
result.push(array.slice(start, end));
} returnresult }
引用网站： https://..com/question/941679549069381612.html?fr=iks&word=js%CA%FD%D7%E9%C7%D0%B7%D6&ie=gbk
三、数据过滤（使用JSON.stringify方法）
数据： persons: [
{apple: '苹果'},
{watermelon: '西瓜'},
{lemon: '柠檬'},
{Blueberry: '蓝莓'},
{orange: '橙子'}],
方法： handChange() {
let oneFruits = JSON.stringify(this.persons, function (inx, ite) {
if (inx === 'watermelon' || inx === 'orange') {
return undefined
} else {
return ite } })
this.persons = JSON.parse(oneFruits) }
结果：
四、通过$set给数据注入值并更新视图（解决在vue中新增数据不更新视图的问题）
数据： persons: [
{id: '1',name: '苹果'},
{id: '2',name: '西瓜'},
{id: '3',name: '柠檬'},
{id: '4',name: '蓝莓'} ]
方法： handChange() {
let oneFruits = JSON.parse(JSON.stringify(this.persons[0]))
let twoFruits = JSON.parse(JSON.stringify(this.persons[1]))
let newFruits = {id: '5', name: '葡萄'}
console.log(twoFruits)
this.$set(this.persons, 1, oneFruits) // 将西瓜的位置放上苹果
this.$set(this.persons, 0, twoFruits) // 将苹果的位置方式西瓜
this.$set(this.persons, 4, newFruits) // 添加葡萄并更新视图
console.log(this.persons) }
结果：
❿ vue前端定时刷新
data(){
return {
intervalId:null }
},methods:{
// 定时刷新数据函数 dataRefreh() {
// 计时器正在进行中，退出函数 if (this.intervalId != null) {
return;
}
// 计时器为空，操作 this.intervalId = setInterval(() => {
console.log("刷新" + new Date());
this.initData(); //加载数据函数 }, 5000);
},
// 停止定时器 clear() {
clearInterval(this.intervalId); //清除计时器 this.intervalId = null; //设置为null },
},created(){
this.dataRefreh();
},destroyed(){
// 在页面销毁后，清除计时器 this.clear();
}
原地址：https://www.cnblogs.com/aurora-ql/p/13300202.html