前端脚本!网站图片素材中文转英文

简介: 写网页的时候, 我们经常需要使用图片素材, 图片素材如果是中文名, 挂到服务器会会引发乱码, 我们需要将图片名称改为英文字符才可以使用而起名是一个世界级难题, 为图片素材起英文名更是一件极其蛋疼的事有些人英语不好, 直接用拼音命名, 而拼音闹出的笑话更是无法计量.
  • 写网页的时候, 我们经常需要使用图片素材, 图片素材如果是中文名, 挂到服务器会会引发乱码, 我们需要将图片名称改为英文字符才可以使用
  • 而起名是一个世界级难题, 为图片素材起英文名更是一件极其蛋疼的事
  • 有些人英语不好, 直接用拼音命名, 而拼音闹出的笑话更是无法计量...

最近接手了一个项目, 图片素材全部是中文命名, 为了避开起名的困扰, 我写了一个脚本,问题迎刃而解, 这里分享给大家

脚本解决的问题

  • 可以为中文命名的图片起一个英文名
  • 可以批量为当前目录及其子目录下图片自动生成新的英文名
  • 新的英文名图片会被输出到新的目录, 不会对原素材有丝毫影响

源码

import os
import re
import copy
import shutil
from googletrans import Translator


# 获取当前目录下所有的css文件路径
def getAllMd (file_dir):
    all_whole_path_files = []
    for root, dirs, files in os.walk(file_dir):
        for file in files:
            try:
                if (file[-4:] == ".png") or (file[-4:] == ".jpg"):
                    file_info = [root+'/', file]
                    all_whole_path_files.append(file_info)
            except Exception as e:
                print(e)
    return all_whole_path_files
    

# 将中文转换为英文
def getRepName(path_file):
    # 暂时保留后缀
    extension_name = ''
    extension_name = path_file[1].split(".")[-1]
    # 无后缀的文件名
    path_file[1] = path_file[1][0:-len(extension_name)-1]
    # 实例化翻译
    translator = Translator()
    tmp_en_name = translator.translate(path_file[1], dest='en').text
    # 将数字和字母保存到最终的字符串中, 遇到空格则替换为中划线保存
    en_name = ''
    for en_name_str in tmp_en_name:
        # 将大写字母转换为小写字母
        en_name_str = en_name_str.lower()
        # 保留小写字母
        if re.match('[a-z]', en_name_str):
            en_name += en_name_str
        # 将空格转换为"-"
        elif en_name_str == " ":
            en_name += "-"
        else:
            pass
    # 补充后缀名
    path_file[1] = en_name + '.' + extension_name
    return path_file


# 根据相对路径及新旧英文名 创建新文件
def createNewFile(whole_path_file, new_whole_path_file):
    # 在图片的同级目录, 创建一个enName的文件夹
    if os.path.exists(whole_path_file[0] + "./enName/"):
        pass
    else:
        os.makedirs(whole_path_file[0]+ "./enName/")
    # 拷贝创建新的文件
    shutil.copyfile(whole_path_file[0]+whole_path_file[1], new_whole_path_file[0]+"./enName/"+new_whole_path_file[1])
        

def main():
    all_whole_path_files = getAllMd('./')
    for whole_path_file in all_whole_path_files:
        # 获取英文名
        new_whole_path_file = getRepName(copy.deepcopy(whole_path_file))
        print("旧的路径和英文名:", whole_path_file, "新的路径和英文名:", new_whole_path_file)
        # 根据相对路径及新旧英文名创建新文件
        createNewFile(whole_path_file, new_whole_path_file)


if __name__ == '__main__':
    main()

这个脚本只是解决了我的问题, 如果有新的需求, 欢迎到这个脚本对应的Github提交需求, 也欢迎点个星, https://github.com/zhaoolee/zhToEnName

目录
相关文章
|
1月前
|
存储 前端开发 JavaScript
🚀前端轻松实现网页内容转换:一键复制、保存图片及生成 Markdown
在现代前端开发中,提升用户的交互体验至关重要。本文将详细介绍如何使用 HTML2Canvas 和 Turndown 两个强大的 JavaScript 库,实现将网页选中文本转化为图片并保存或复制到剪贴板,或将内容转换为 Markdown 格式。文章包含核心代码实现、技术细节和功能拓展方向,为开发者提供了一个轻量级的解决方案,提升用户体验。
136 68
|
16天前
|
前端开发 JavaScript API
惊呆了!这些前端技术竟然能让你的网站实现无缝滚动效果!
【10月更文挑战第30天】本文介绍了几种实现网页无缝滚动的技术,包括CSS3的`scroll-snap`属性、JavaScript的Intersection Observer API以及现代前端框架如React和Vue的动画库。通过示例代码展示了如何使用这些技术,帮助开发者轻松实现流畅的滚动效果,提升用户体验。
86 29
|
9天前
|
前端开发 JavaScript UED
惊呆了!这些前端技巧竟然能让你的网站秒变高大上,赶快学起来!
前端技术是网页设计的核心,能够显著提升用户体验和网站竞争力。本文介绍了三种实用的前端技巧:动态背景效果、微交互设计和响应式设计。通过CSS动画和JavaScript,可以实现视觉吸引的动态背景;微交互设计如按钮点击效果能增强用户参与感;响应式设计则确保网站在不同设备上呈现良好效果。这些技巧简单易学,效果显著,值得尝试。
20 3
|
9天前
|
移动开发 前端开发 JavaScript
惊!这些前端技术竟然能让你的网站在移动端大放异彩!
随着互联网技术的发展,移动设备成为主要的上网工具。本文介绍了几种关键的前端技术,包括响应式设计、图片优化、字体选择、HTML5和CSS3的应用、性能优化及手势操作设计,帮助开发者提升网站在移动端的显示效果和用户体验。示例代码展示了如何实现简单的双向绑定功能。
18 3
|
14天前
|
前端开发 JavaScript API
惊呆了!这些前端技巧竟然能让你的网站支持AR/VR体验!
【10月更文挑战第31天】在数字化时代,用户对网页交互体验的要求日益提高,传统二维网页已难以满足需求。本文介绍如何利用前端技术,特别是Three.js,实现AR/VR体验,提升用户满意度和网站价值。通过示例代码,展示如何创建简单的3D场景,并探讨AR/VR技术的基本原理和常用工具,帮助开发者打造沉浸式体验。
31 6
|
14天前
|
编解码 前端开发 JavaScript
前端界的黑科技:掌握这些技术,让你的网站秒变未来感十足!
【10月更文挑战第31天】前端技术日新月异,黑科技层出不穷,让网页更加美观、交互更加丰富。本文通过响应式布局与媒体查询、前端框架与组件化开发等案例,展示这些技术如何让网站充满未来感。响应式布局使网站适应不同设备,前端框架如React、Vue则提高开发效率和代码质量。
27 3
|
16天前
|
JSON 前端开发 搜索推荐
惊!这些前端技术竟然能让你的网站实现个性化推荐功能!
【10月更文挑战第30天】随着互联网技术的发展,个性化推荐已成为提升用户体验的重要手段。前端技术如JavaScript通过捕获用户行为数据、实时更新推荐结果等方式,在实现个性化推荐中扮演关键角色。本文将深入解析这些技术,并通过示例代码展示其实际应用。
47 4
|
16天前
|
自然语言处理 前端开发 搜索推荐
前端界的黑科技:掌握这些技术,让你的网站秒变智能助手!
【10月更文挑战第30天】随着前端技术的发展,网站正逐渐变成智能助手。本文探讨了四大关键技术:自然语言处理(NLP)使网站理解用户输入;机器学习实现个性化推荐;Web Notifications API发送重要提醒;Web Speech API实现语音交互。通过这些技术,网站不仅能更好地理解用户,还能提供更智能、个性化的服务,提升用户体验。
29 3
|
16天前
|
搜索推荐 前端开发 UED
惊!这些前端技巧竟然能让你的网站在搜索引擎中获得更高排名!
【10月更文挑战第30天】在数字化时代,网站的搜索引擎排名直接影响流量和品牌知名度。本文通过四个真实案例,揭秘前端技巧如何提升搜索引擎排名:1. 关键词优化与布局;2. 高质量内容与多媒体优化;3. 网站结构优化与URL优化;4. 提升页面加载速度。这些技巧不仅提高排名,还能增强用户体验,助力业务发展。
34 3
|
16天前
|
前端开发 JavaScript 开发者
惊!这些前端技术竟然能让你的网站在社交媒体上疯传!
【10月更文挑战第30天】在这个信息爆炸的时代,社交媒体成为内容传播的重要渠道。本文介绍了前端开发者如何利用技术让网站内容在社交媒体上疯传,包括优化分享链接、创建引人注目的标题和描述、利用Open Graph和Twitter Cards、实现一键分享功能以及创造交互式内容。通过这些方法,提升用户分享意愿,使网站成为社交媒体上的热门话题。
27 2