JavaScript進(jìn)階練習(xí)及簡單實(shí)例分析

更新時(shí)間：2016年06月03日 09:04:19 投稿：jingxian

下面小編就為大家?guī)硪黄狫avaScript進(jìn)階練習(xí)及簡單實(shí)例分析。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧

當(dāng)用戶點(diǎn)擊”統(tǒng)計(jì)“按鈕時(shí)，在窗口中彈出文本框中出現(xiàn)次數(shù)最多的字符并顯示其出現(xiàn)的次數(shù)

點(diǎn)擊統(tǒng)計(jì)按鈕時(shí)效果如圖所示：

實(shí)現(xiàn)代碼：

<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <script type="text/javascript"> 
  window.onload = function () { //獲取表單對象 var form = document.getElementById("myform"); //給“統(tǒng)計(jì)”按鈕注冊單擊事件 form.btn.onclick = function () { //獲取文本框中的值 var txt = form.name.value; //定義一個(gè)空的js對象用于保存文本空中的所有字符及出現(xiàn)的次數(shù) var json = {}; //遍歷文本框中的值也就是txt變量中保存的字符串 for (var i = 0; i < txt.length; i++) { //提取txt字符串中下標(biāo)為i的子符并判斷json對象是否未定義屬性名為給字符符的屬性 if (!json[txt.charAt(i)]) { //沒有定義則定義該屬性（表示在文本框中出現(xiàn)的字符）并賦值為1，代表該屬性對應(yīng)的字符在文本框中出現(xiàn)的次數(shù) json[txt.charAt(i)] = 1; } else { //已經(jīng)定義則將該屬性的值加1，也就是將代表該屬性對應(yīng)的字符在文本框中出現(xiàn)的次數(shù)加1 json[txt.charAt(i)]++; } } //定義兩個(gè)變量 var maxnum = 0;//代表文本框中出現(xiàn)次數(shù)最多的字符出現(xiàn)的次數(shù)默認(rèn)為0 var char = "";//代表文本框中出現(xiàn)次數(shù)最多的字符默認(rèn)為空 //遍歷json對象的屬性值 for (var i in json ) { if (json[i]>maxnum) { //如果json該屬性的值大于maxnum（也就是說該屬性對應(yīng)的字符再問本框中出現(xiàn)的次數(shù)比之前的所有字符都要打）則將其賦值給maxnum并將其屬性名賦值給char maxnum = json[i]; char = i; } } alert("文本框中出現(xiàn)最多的字符是：" + char + " 出現(xiàn)的次數(shù)是：" + maxnum); } }; </script> </head> <body> <form id="myform"> <input type="text" name="name" value="123" /> <input type="button" name="btn" value="統(tǒng)計(jì)"/> </form> </body> </html>

js對象屬性可以后期添加的特點(diǎn)、對象屬性的遍歷等js對象的綜合運(yùn)用。

js相關(guān)的知識(shí)可以參考javascript對象的相關(guān)操作

以上這篇JavaScript進(jìn)階練習(xí)及簡單實(shí)例分析就是小編分享給大家的全部內(nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

您可能感興趣的文章: