JavaScript進(jìn)階練習(xí)及簡單實例分析
當(dāng)用戶點擊”統(tǒng)計“按鈕時,在窗口中彈出文本框中出現(xiàn)次數(shù)最多的字符并顯示其出現(xiàn)的次數(shù)
點擊統(tǒng)計按鈕時效果如圖所示:
實現(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)計”按鈕注冊單擊事件 form.btn.onclick = function () { //獲取文本框中的值 var txt = form.name.value; //定義一個空的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)]++; } } //定義兩個變量 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)計"/> </form> </body> </html>
js對象屬性可以后期添加的特點、對象屬性的遍歷等js對象的綜合運(yùn)用。
js相關(guān)的知識可以參考javascript對象的相關(guān)操作
以上這篇JavaScript進(jìn)階練習(xí)及簡單實例分析就是小編分享給大家的全部內(nèi)容了,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關(guān)文章
JavaScript中的location、history、navigator對象實例介紹
這篇文章主要介紹了JavaScript中的location、history、navigator對象實例介紹,需要的朋友可以參考下2023-05-05統(tǒng)計出現(xiàn)最多的字符次數(shù)的js代碼
一小段代碼,經(jīng)常出現(xiàn)在面試筆試題中的:統(tǒng)計一個字符串中出現(xiàn)最多的字符的次數(shù),可以是英文或者數(shù)字。2010-12-12如何使用瀏覽器擴(kuò)展篡改網(wǎng)頁中的JS?文件
這篇文章主要為大家介紹了如何使用瀏覽器擴(kuò)展篡改網(wǎng)頁中的JS文件實現(xiàn)解析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-05-05JavaScript下一版本標(biāo)準(zhǔn)ES6的Set集合使用詳解
ES6:全稱ECMAScript 6.0,是JavaScript語言的國際標(biāo)準(zhǔn),JavaScript是ECMAScript的實現(xiàn)。今天我們就來學(xué)習(xí)一下ES6的Set集合的使用2023-02-02JS判斷不同分辨率調(diào)用不同的CSS樣式文件實現(xiàn)思路及測試代碼
最近看一個網(wǎng)站,發(fā)現(xiàn)顯示器不同的分辨率,樣式文件調(diào)用的也不一樣,于是很好奇研究并寫了一個,經(jīng)測試感覺還不錯,感興趣的你可以來看看哦2013-01-01深入分析escape()、encodeURI()、encodeURIComponent()的區(qū)別及示例
這篇文章主要介紹了escape()、encodeURI()、encodeURIComponent()的區(qū)別,需要的朋友可以參考下2014-08-08uniapp小程序自定義tabbar以及初次加載閃屏解決方法
Uniapp小程序可以通過自定義tabbar來實現(xiàn)更加個性化的界面設(shè)計,下面這篇文章主要給大家介紹了關(guān)于uniapp小程序自定義tabbar以及初次加載閃屏解決方法,文中通過圖文介紹的非常詳細(xì),需要的朋友可以參考下2023-05-05