❶ 前端的數據，後台一般怎麼更新前端數據
前端的數據如果都是從後端請求過來的話， 後端直接更新數據就行了 ，一般來說後端的數據都是保存在資料庫中的（比如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