Ruby标签：中文加拼音显示

鍋氬墠绔紑鍙戜箙浜嗭紝杩樻槸浼氶亣鍒颁竴浜涙病瀛﹁繃鐨勭煡璇嗙偣銆備粖澶╁垎浜竴涓渶杩戠敤鍒扮殑鍔熻兘锛氭枃瀛楁樉绀烘嫾闊炽€傛寜鐓уぇ浣撶殑鎬濊矾锛屽氨鏄湪涓枃涓婇潰鍔犱竴涓猻pan锛岀劧鍚庨€氳繃瀹氫綅绛夋搷浣滐紝鎶婂畠绉诲埌鏂囨湰鐨勬渶鍓嶉潰銆備絾鏄繖涓搷浣滃お楹荤儲浜嗭紝鑰屼笖浠ｇ爜寰堝銆傚悗鏉ョ湅鍒癶tml鏍囩閲岄潰鏈変釜ruby鏍囩锛屽氨鏄敤鏉ヨВ鍐宠繖涓棶棰樼殑銆傛瘮濡俽uby锛屾垜浠瀵逛笅闈㈢殑鏂囧瓧鍋氫竴涓嫾闊虫樉绀猴紝浠ｇ爜鎬庝箞鍐欙細hao璋佸啓鐨勪唬鐮?rp>(xi臎d脿im菐deh脿o)鏁堟灉濡傚浘锛氭垜浠細鍙戠幇鎷奸煶琚畬鍏ㄧ矘璐翠簡锛屽洜涓虹矘璐翠簡浠ｇ爜涓殑rt鍐呭銆傝鎴戜滑灏濊瘯娣诲姞绌烘牸銆傛嫾闊冲姞绌烘牸浠ｇ爜濡備笅锛?ruby>Haowhowritethecode(xi臎d脿im菐deh脿o)鐨勬晥鏋滃涓嬶細濂藉浜嗭紝浣嗘槸濂藉儚娌℃湁瀵归綈锛岃€屼笖鎷奸煶姣旀枃瀛楁洿闈犲乏銆傛垜灏濊瘯浜嗗嚑绉嶆柟娉曪紝浣嗗畠浠棤娉曟敼鍙樺榻愰棶棰樸€傛墍浠ワ紝鎴戞兂鐭ラ亾鏄惁鍙互灏嗘瘡涓崟璇嶅崟鐙嫾闊炽€傚幓鍋氬氨瀵逛簡銆傛瘡涓眽瀛楃殑鎷奸煶浠ｇ爜濡備笅锛?ruby>鍐?rp>(xi臎)鏇挎崲(d脿i)浠ｇ爜(m菐)(de)濂?rp>(h脿o)鏁堟灉濡備笅锛氬畬缇庛€傛帴涓嬫潵灏辨槸瑙ｅ喅鏂囧瓧鍙樺寲鐨勯棶棰樹簡銆傛嫾闊宠嚜鍔ㄤ粠鏂囨湰涓幏鍙栥€傚湪缃戜笂鎵句簡涓€涓簱锛歱inyin-pro鏉ヨВ鍐宠繖涓€氳繃鏂囧瓧璇嗗埆鎷奸煶鐨勯棶棰樸€俻inyin-pro瀹樼綉锛歨ttp://pinyin-pro.cn/pinyin-pro鍏蜂綋浣跨敤鏂规硶杩欓噷灏变笉涓€涓€鍒椾妇浜嗐€傚鏋滀綘鎯充簡瑙ｆ洿澶氾紝浣犲彲浠ュ幓鏂囨。銆傛垜杩欓噷demo鐨勪唬鐮佸涓嬶細constgzhStr='haowhowritethecode'.split('');const{鎷奸煶}=pinyinPro;constgzhPy=pinyin(gzhStr.join(''),{type:'array'});console.log(gzhStr.join(''),gzhPy.join(''));constcontainerEl=document.getElementById('gzh');for(璁﹊=0,len=gzhPy.length;i(${gzhPy[i]})`;containerEl.appendChild(rubyEl);}閫昏緫鏄皢鏂囧瓧鍜屽搴旂殑鎷奸煶鎷兼垚ruby瑕佹眰鐨勬牸寮忥紝杈撳嚭鍒板搴旂殑DOM鑺傜偣銆傛晥鏋滃鍥撅細浣犱細鍙戠幇铏界劧DOM鑺傜偣鍜屼笂闈竴鏍凤紝浣嗘槸鏂囧瓧闂磋窛寰堝皬锛屾病鏈夊墠闈㈠浐瀹氱殑鏂囧瓧濂界湅銆備簬鏄張缁檙uby鍔犱簡涓€涓牱寮忥細#gzhruby鈥嬧€媨margin-right:4px;}鏁堟灉濡備笅锛氳繖鏍峰氨瀹岀編浜嗐€傛渶鍚庡埗浣滀竴涓緭鍏ユ锛屽皾璇曡緭鍏ヤ换鎰忎腑鏂囥€傚湪杈撳叆妗嗚緭鍏ヤ换鎰忎腑鏂囦唬鐮佷笉鏀撅紝鍙湅缁撴灉锛氭渶鍚庯紝鏈夎皝鐭ラ亾杩欎釜鍑芥暟鐨勬爣绛句负浠€涔堝彨ruby锛熷畬浜嗭紝鏈枃鍒版缁撴潫锛屽笇鏈涜繖绡囨枃绔犲浣犳湁鎵€甯姪:-)鏈€杩戝張鍙戜簡涓€绡囧叕浼楀彿锛氬啓浠ｇ爜鐨勮豹鍝ワ紝姹傚叧娉煒勩€傚悗闈細鎱㈡參绉疮鑷繁鎺屾彙鐨勫墠绔煡璇嗗拰鑱屽満鐭ヨ瘑銆傛湁浠€涔堥棶棰樻垨鑰呭缓璁彲浠ュ浜ゆ祦銆傚師鍒涙枃绔犳枃绗旀湁闄愶紝鐭ヨ瘑鍖箯銆傚鏋滄枃绔犱腑鏈変换浣曚笉鍑嗙‘鐨勫湴鏂癸紝璇峰憡璇夋垜銆?/p>