Original articles, reprint please indicate the source https://juejin.cn/post/6844903590725844999
This is an Android developers JS attempt, if there is improper use of JS code, or adaptation related problems, welcome message, thank you very much
Start with a screenshot of the gadget, which is an HTML file. Unable to upload files, the end of the article gives the source code, their own save an HTML page, code copied to replace the original page code, you can use ~ pro test available ~
Tips: There is no specific test on which browsers can be supported. I use 360’s browser. If you want to create a TXT file and copy it into it, save it in utF-8 encoding format. The new TXT file on my computer is in ANSI encoding format ~
Use process and result renderings:
I. Background introduction
When developing an APP, you always need to put some ICONS in the APP. Android has multiple Drawable folders. When there are many pictures, naming is really tedious and boring work. So began to hit the batch naming program idea.
Since I use Windows system, the first thing that comes to mind is batch command. I have been using Excel formula to generate these batches of code, but recently I thought of JS and started to try.
Originally wanted to directly download the bat file, but because of the use of file download js method fixed download files are UTF-8 encoding format, but the Windows batch command does not support this, will be garble. Converting UTF-8 to ANSI was out of my reach, so I had to settle for a version that required manual copying of the bat command text. If you have a better solution, please leave a message.
2. Introduction to use
I believe the above screenshot has been very clear, do not understand the page, look at the code comments can understand… Without further ado…
Iii. Source code
The commented out button code is used to download the bat file, the funDownLoad() function. Interested friends can try it.
<! DOCTYPE html> <html> <head> <meta charset="UTF-8"</title> <script SRC ="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script type="text/javascript">
function addDpi(){
var dpi_name =$('#dpi_input_add').val();
var innerHtml = document.getElementById('dpi_names').innerHTML;
var i=1;
while(innerHtml.indexOf('dpi_name_id'+i)>=0 && i<10){
i++;
}
if(i>=10){
alert('Add a maximum of 10 folder names ~! ');
}else{
document.getElementById('dpi_names').innerHTML =
innerHtml+'<input style=\'margin:5px; \' id=\'dpi_name_id'+i+"\' value=\'"+dpi_name+"\'/><br/>"; Function getFileUrl(sourceId,index) {function getFileUrl(sourceId,index) {var url; if (navigator.userAgent.indexOf("MSIE")>=1) { // IE url = document.getElementById(sourceId).value; } else if(navigator.userAgent.indexOf("Firefox")>0) { // Firefox url = window.URL.createObjectURL(document.getElementById(sourceId).files.item(index)); } else if(navigator.userAgent.indexOf("Chrome")>0) { // Chrome url = window.URL.createObjectURL(document.getElementById(sourceId).files.item(index)); } return url; } function fileSelect1() { var file = document.getElementById("fileSelected1").files; //var ret =''; var file_new_name_edit_views = ""; for(var i = 0, len = file.length; i < len; i++) { var f = file[i]; var type = f.type; if(type){ type = type.substr(type.indexOf('\/'),f.type.length) .replace('\/',''); //ret += (i+':'+f.name + '(' + f.type + ')'+type+'
'); File_new_name_edit_views += '' +'< TD width="
\>100">' +'imgPre1" src="'+getFileUrl("fileSelected1",i)+'" width="50px" height="50px" style="display: block;" />' +'' +'100">' +'file_old_name'+i+'">'+f.name+' ' +'' +'100">' +'file_new_name'+i+'" type="text" placeholder="'+f.name.replace('.'+type,''+'"/> ' +'' +''; }else{ //ret+= (i+':'+f.name + '(' + f.type + ')---
'); } } //document.getElementById('ret').innerHTML = ret; document.getElementById('edit_file_names').innerHTML = file_new_name_edit_views; } function getBatText() { var file = document.getElementById("
\>fileSelected1").files; var ret =''; for(var i = 0, len = file.length; i < len; i++) { var f = file[i]; var innerHtml = document.getElementById('dpi_names').innerHTML; var j=1; var new_name_input = document.getElementById('file_new_name'+i); if(new_name_input){ var file_new_name = new_name_input.value.trim(); If (file_new_name && file_new_name. Length!) =0){if(ret. IndexOf (file_new_name+'.*')>=0){alert(' file_new_name+'); return; }else{ while(innerHtml.indexOf('dpi_name_id'+j)>=0 && j<10){ var dpi_name_temp = document.getElementById('dpi_name_id'+j).value; // Use double quotation marks to prevent renaming failures caused by Spaces in file names. New_name have trim, without adding ret + = 'ren. \ \' + dpi_name_temp + '\ \ \ "" + motor ame +' \" "+ file_new_name + '. * < br > '; j++; } } } } } document.getElementById('bat_text').innerHTML = ret; } //// function funDownload() { var innerHTML = document.getElementById('bat_text') .innerHTML; //alert(innerHTML); var content = innerHTML.replace(new RegExp('
',"gm"),'\r\n'); //alert(content); if(content){ var filename = "rename.bat"; Var eleLink = document.createElement('a'); eleLink.download = filename; eleLink.style.display = 'none'; / / add: Unicode Signature BOM(Byte Order Mark)EF BB BF // Var blob = new blob ([new Uint8Array([0xEF, 0xBB, 0xBF]), content]); // UTF-8 BOM var blob = new Blob(['\ufeff'+content]); // To export the CSV format, add the BOM header elelink.href = url.createObjecturl (blob); / / triggered by clicking on the document. The body. The appendChild (eleLink); eleLink.click(); / / then remove document. Body. RemoveChild (eleLink); }else{alert(' No content to generate file, please confirm ~'); }} function strToHexCharCode(STR) {if(STR ===""Return")"; Var hexCharCode = []; hexCharCode.push("0x"); hexCharCode.push("EFBBBF"); for(var i = 0; i < str.length; I++) {hexCharCode. Push ((STR) charCodeAt (I)). ToString (16)); } hexCharCode.push("2E2A"); return hexCharCode.join(""); } background-color: #ddd; padding:10px;" > the author: Zhu Peipei android development engineer Use is introduced: https://juejin.cn/post/6844903590725844999;<p> Note: Step 2 uses the method webkitDirectory to select folders, but this is not a standard supported attribute, after testing, currently only supports Chrome, IE11/MOZ does not support Safari. </p> <br />1. Edit the corresponding folder name and click ok to generate the bat renamed file content. <br /> <input style="margin:5px;" id="dpi_input_add" type="text" placeholder="Enter dPI folder name"/>
<button onclick="addDpi()"</button>< div id="dpi_names" style="background-color: #ddd; padding:10px 0px 10px 0px ;">
<input style="margin:5px;" id="dpi_name_id1" value="mipmap-mdpi"/><br/>
<input style="margin:5px;" id="dpi_name_id2" value="mipmap-xhdpi"/><br/>
<input style="margin:5px;" id="dpi_name_id3" value="mipmap-xxxhdpi"/><br/> </div> <br /><br /> <br />2. Click the button below to select a DPI folder, or drag the folder to the button below: <br /> < INPUTtype="file" id="fileSelected1" webkitdirectory onchange="fileSelect1()"/><br /><br /><br />3. Before generating a table, select the folder name to be generated (the folder name does not contain suffixes, and the new folder name is verified repeatedly, and empty strings are deleted, and unnamed files are ignored) :<br />< table ID ="edit_file_names" style="max-height:300px; overflow:auto; padding:10px; background-color: #eee; width:300; cellpadding:0; cellspacing:0;">
<tr>
<td width="50px">
<img id="imgPre1" src="" width="50px" height="50px" style="display: block;" />
</td>
<td width="200px">
<div id="file_old_name1"PNG </div> </td> < TD width="200px">
<input id="file_new_name1" type="text" placeholder="Sample"/> </td> </tr> </table> <br /><br /> <br />4. Click the button to generate text. Copy the following and create a BAT file. <br /> <button ID ="btn" onclick="getBatText()"</button> <! -- <button onclick="funDownload()"Bat file > download < / button > -- > < br / > < br / > < div > - generated bat file information is as follows: < / div > < div id ="bat_text" style="background-color: #aaa; padding: 10px; max-height: 300px; overflow:auto;"> sample: < br / > ren Amy polumbo ng b. * < br / > ren c.p ng d. * < br / > ren c.p ng d. * < / div > < / body > < / HTML >Copy the code