上篇文章写到了Python开发英语单词记忆工具,其中依赖了bootstrap.css jQuery.js 基础html模块以及片段的css样式。有些朋友问,怎么能将这个练习题打包成单独的exe可执行文件,来脱离python环境使用呢?
私信小编01即可获取大量的Python学习资料
在这里跟大家简单说下思路,有需求的朋友可以自己去扒拉扒拉…
依赖的css和js,如果有外网的前提,可以使用bootcdn提供的链接引用:
https://cdn.bootcss.com/jquery/3.4.0/jquery.min.js
https://cdn.bootcss.com/twitter-bootstrap/3.4.1/css/bootstrap.min.css
自己编辑的css样式,可以添加在head中的style中
基础html可以作为一大段的string在python中进行定义,最终替换关键内容后输出。至于cet4的单词表,建议就不要添加在代码中了,和打出来的exe文件放置在一起即可。
好了,思路就是这些,喜欢的朋友可以去尝试做一下,这样就可以无时无刻给自己出一份英语练习测试题了。
大家平时在Linux/Windows下安装软件时,经常会出现进度条和百分比的提示,Python是否能实现这样的打印?安装过程中,经常会看到很多带颜色的安装说明,我们在python输出时,确是千篇一律的黑底白色,是否想过打印的炫酷一些呢?
以上操作其实很简单,今天就来教教大家,通过几分钟的学习让之后代码的输出变得与众不同!
python打印进度条的原理其实很简单,先让我们看一个例子吧:
# -*- coding: utf-8 -*-
# @Author : 王翔
# @WeChat : King_Uranus
# @公众号 : 清风Python
# @Date : 2019/9/16 22:09
# @Software : PyCharm
# @version :Python 3.7.3
# @File : ProgressBar.py
import time
def progress_bar(total):
if total <= 0:
raise ValueError("Wrong total number ...")
# step = (100 // total if total <= 100 else total // 100)
for i in range(0, total):
time.sleep(0.05)
step = int(100 / total * (i + 1))
str1 = '\r[%3d%%] %s' % (step, '>' * step)
print(str1, end='', flush=True)
progress_bar(20)
print()
progress_bar(110)
我们通过自己实现了进度条的展示,那么python是否具备现成的模块呢?答案是Yes![ tqdm ]
Tqdm 是一个快速,可扩展的Python进度条,可以在 Python 长循环中添加一个进度提示信息,用户只需要封装任意的迭代器 tqdm(iterator)。
安装:pip install tqdm
来看一个例子:
from tqdm import tqdm
import string
import time
for char in tqdm(string.ascii_uppercase):
time.sleep(0.1)
for i in tqdm(range(50)):
time.sleep(0.05)
tqdm的强大远不止此,喜欢的朋友可以去它的git网址详细学习:
https://github.com/tqdm/tqdm
python颜色输出其实只是调用了命令号的相关特殊标记,shell中我们也经常使用它:
print('\033[30m打印前景色0\033[0m')
print('\033[31m打印前景色1\033[0m')
print('\033[32m打印前景色2\033[0m')
print('\033[33m打印前景色3\033[0m')
print('\033[34m打印前景色4\033[0m')
print('\033[35m打印前景色5\033[0m')
print('\033[36m打印前景色6\033[0m')
print('\033[37m打印前景色7\033[0m')
print('\033[40m打印背景色0\033[0m')
print('\033[41m打印背景色1\033[0m')
print('\033[42m打印背景色2\033[0m')
print('\033[43m打印背景色3\033[0m')
print('\033[44m打印背景色4\033[0m')
print('\033[45m打印背景色5\033[0m')
print('\033[46m打印背景色6\033[0m')
print('\033[47m打印背景色7\033[0m')
print('\033[0m打印显示方式0\033[0m')
print('\033[1m打印显示方式1\033[0m')
print('\033[4m打印显示方式4\033[0m')
print('\033[5m打印显示方式5\033[0m')
print('\033[7m打印显示方式7\033[0m')
print('\033[8m打印显示方式8\033[0m')
print('\033[5;31;47m综合打印\033[0m')
每条默认的**3[0m为回复终端默认
最后一个3[5;31;47m**综合打印为使用闪烁方式红色字体白色背景色打印文字!
参数说明:
那么和上面一样的套路,python中是否有模块能实现这种颜色打印的功能呢?答案依然是Yes! [ colorama ]
Python的Colorama模块,可以跨多终端,显示字体不同的颜色和背景,只需要导入colorama模块即可,不用再每次都像linux一样指定颜色。
pip install colorama
Fore是针对字体颜色,Back是针对字体背景颜色,Style是针对字体格式
Fore: BLACK, RED, GREEN, YELLOW, BLUE, MAGENTA, CYAN, WHITE, RESET.
Back: BLACK, RED, GREEN, YELLOW, BLUE, MAGENTA, CYAN, WHITE, RESET.
Style: DIM, NORMAL, BRIGHT, RESET_ALL
>>> from colorama import Fore, Back, Style
>>> print(Fore.RED + '打印红色文字')
>>> 打印红色文字
>>> print(Back.GREEN + '设置背景为绿色')
>>> 设置背景为绿色
>>> print(Style.RESET_ALL)
>>> print('恢复默认')
>>> 恢复默认
细心的网友看到,我们如果没有恢复默认的话,会继承上面的颜色状态。那么,如何像刚才一样,每次输出后自动化恢复呢?
from colorama import init, Fore, Back, Style
init(autoreset=True)
print(Fore.RED + '打印红色文字')
print(Back.GREEN + '设置背景为绿色')
print('恢复默认')
关于装13,只能帮大家到这里了,希望今天的内容大家能喜欢…
更多精彩内容,请滑至顶部点击右上角关注小宅哦~
者:前端小智 来源:大迁世界
.md文件是markdown的一种标记语言,和html比较起来,更简单快捷,主要体现在:标记符的数量和书写上。
方式一:使用i5ting_toc插件
需要先安装npm(安装node.js后会自带npm),然后才能安装i5ting插件:
npm install i5ting_toc -g
执行命令行生成html文件,在输入前要进入到对应根目录下:
i5ting_toc -f **.md
需要注意的是:写md文档的特殊符号时记得添加空格。小技巧:如何快速在当前目录打开cmd?选择当前目录,按住shift,然后鼠标右键在此处打开命令窗口(在此处打开powerShell窗口)。
方式二:使用gitbook
同样先需要安装node,然后运行:
npm i gitbook gitbook-cli -g
生成md文件,这个命令会生成相应的md的文件,然后在相应的文件里写你的内容即可:
gitbook init
md转html,生成一个_doc目录,打开就可以看到你html文件了。
gitbook build
方式三:利用前端代码
实现原理是采用node.js搭建服务器,读取md文件转化为html片断。浏览器发送ajax请求获取片段后再渲染生成html网页。
node代码:
var express = require('express');
var http = require('http');
var fs = require('fs');
var bodyParser = require('body-parser');
var marked = require('marked'); // 将md转化为html的js包
var app = express();
app.use(express.static('src')); //加载静态文件
var urlencodedParser = bodyParser.urlencoded({ extended: false });
app.get('/getMdFile',urlencodedParser, function(req, res) {
var data = fs.readFileSync('src/test.md', 'utf-8'); //读取本地的md文件
res.end(JSON.stringify({
body : marked(data)
}));
} );
//启动端口监听
var server = app.listen(8088, function () {
var host = server.address().address;
var port = server.address().port;
console.log("应用实例,访问地址为 http://%s:%s", host, port)
});
前端html:
<div id="content"> <h1 class="title">md-to-HTML web app</h1> <div id="article"> </div></div><script type="text/JavaScript" src="js/jquery-1.11.3.min.js"></script><script> var article = document.getElementById('article'); $.ajax({ url: "/getMdFile", success: function(result) { console.log('数据获取成功'); article.innerHTML = JSON.parse(result).body; }, error: function (err) { console.log(err); article.innerHTML = '<p>获取数据失败</p>'; } });</script>
代码,没案例,简直就是耍流氓,为了方便大家学习交流,每个知识点都会配上对应的案例!文章最下边有福利哟....
创建节点:$("<div></div>")
创建为本节点:$("<div>我是文本节点</div>")
创建为属性节点:$("<div id='test' class='aaron'>我是文本节点</div>")
例子:var div = $("<div class='right'><div class='aaron'>动态创建DIV元素节点</div></div>")
$body.append(div)
append(content)向每个匹配的元素内部追加内容,这个操作与对指定的元素执行原生的appendChild方法,将它们添加到文档中的情况类似。
appendTo(content) 把所有匹配的元素追加到另一个、指定的元素集合中,实际上,使用这个方法是颠倒了常规的$(A).append(B)的操作,即不是把B追加到A中,而是把A追加到B中。
.after(content) 在匹配元素集合中的每个元素后面插入指定内容,作为兄弟节点
.before(content) 在匹配的元素前面插入内容
1、before与after都是用来对相对选中元素外部增加相邻的兄弟节点
2、2个方法都是都可以接收HTML字符串,DOM 元素,元素数组,或者jQuery对象,用来插入到集合中每
个匹配元素的前面或者后面
3、2个方法都支持多个参数传递after(div1,div2,....)
.prepend() 向每个匹配元素的内部前置内容 和append()类型
.prependTo() 把所有匹配的元素前置到另一个指定的元素集合中
四个区别:
append()向每个匹配的元素内部追加内容
prepend()向每个匹配的元素内部前置内容
appendTo()把所有匹配的元素追加到另一个指定元素的集合中
prependTo()把所有匹配的元素前置到另一个指定的元素集合中
insertBefore() 在目标元素前面插入集合中每个匹配的元素(不支持多参数)
insertAfter() 在目标元素后面插入集合中每个匹配的元素(不支持多参数)
.before()和.insertBefore()实现同样的功能。主要的区别是语法——内容和目标的位置。 对于
before()选择表达式在函数前面,内容作为参数,而.insertBefore()刚好相反,内容在方法前面,它将
被放在参数里元素的前面
例:$(".test1").before('<p style="color:red">before,在匹配元素之前增加</p>')
$('<p style="color:red">测试insertBefore方法增加</p>').insertBefore($(".test1"))
empty()这个方法不仅移除子元素(和其他后代元素),同样移除元素里的文本
例:$('.hello').empty() //删除.hello里边的所有内容
remove与empty一样,都是移除元素的方法,但是remove会将元素自身移除,同时也会移除元素内部的一切,包括绑定的事件及与该元素相关的jQuery数据。
例:$('.hello').remove()
$("p").remove(":contains('3')")//找到包含3文本的节点删除
detach()让一个web元素托管。即从当前页面中移除该元素,但保留这个元素的内存模型对象。
例: $("p:first").detach()
.clone()方法深度 复制所有匹配的元素集合,包括所有匹配元素、匹配元素的下级元素、文字节点。
.clone(ture) 表示不仅仅克隆节点,还把附带的数据和事件一并克隆了!
1、clone()方法时,在将它插入到文档之前,我们可以修改克隆后的元素或者元素内容,
$(this).clone().css('color','red') 表示增加了一个颜色
2、通过传递true,将所有绑定在原始元素上的事件处理函数复制到克隆元素上
3、clone()方法是jQuery扩展的,只能处理通过jQuery绑定的事件与数据
4、元素数据(data)内对象和数组不会被复制,将继续被克隆元素和原始元素共享。深复制的所有数据,需要手动复制每一个
例: $(".aaron1").on('click', function() {
$(".left").append( $(this).clone().css('color','red') )
})//只克隆节点不克隆事件
.replaceWith( newContent ):用提供的内容替换集合中所有匹配的元素并且返回被删除元素的集合
例:$("p:eq(1)").replaceWith('<a style="color:red">替换第二段的内容</a>')
.replaceAll( target ) :用集合的匹配元素替换每个目标元素 目标和源和replaceWith相反
例:$('<a style="color:red">替换第二段的内容</a>').replaceAll('p:eq(1)')
.wrap( wrappingElement ):在集合中匹配的每个元素周围包裹一个HTML结构,即增加父元素<p>p元素</p> 增加:$('p').wrap('<div></div>') 变成了<div><p>p元素</p></div>
.wrap( function ) :一个回调函数,返回用于包裹匹配元素的 HTML 内容或 jQuery 对象
例:$('p').wrap(function() {
return '<div></div>'; //与第一种类似,只是写法不一样
})
unwarp()方法 ,作用与wrap方法是相反的。将匹配元素集合的父级元素删除,保留自身(和兄弟元素,如果存在)在原来的位置。
例:$('p').unwarp(); //删除p的父节点
.wrapAll( wrappingElement ):给集合中匹配的元素增加一个外面包裹HTML结构
.wrapAll( function ) :一个回调函数,返回用于包裹匹配元素的 HTML 内容或 jQuery 对象通过回调的方式可以单独处理每一个元素
例:$('p').wrapAll('<div></div>') 结果:
<div>
<p>p元素</p>
<p>p元素</p>
</div> //给所有的p增加父元素,增加一个,不是每个单独增加父元素
$('p').wrapAll(function() {
return '<div><div/>';
})该方法返回结果是:
<div>
<p>p元素</p>
</div>
<div>
<p>p元素</p>
</div>
什么情况? 两个例子中的结果为什么不一样呢?小伙伴们自己查查咋回事呢?
注意:.wrapAll()函数可以接受任何字符串或对象,可以传递给$()工厂函数来指定一个DOM结构。这种
结构可以嵌套多层,但是最内层只能有一个元素。所有匹配元素将会被当作是一个整体,在这个整体的外部用指定的 HTML 结构进行包裹。
.wrapInner( wrappingElement ):给集合中匹配的元素的内部,增加包裹的HTML结构
例:<div>p元素</div><div>p元素</div> 执行:$('div').wrapInner('<p></p>')变成了:
<div><p>p元素</p></div>
<div><p>p元素</p></div>
.wrapInner( function ) :允许我们用一个callback函数做参数,每次遇到匹配元素时,该函数被执行,返回一个DOM元素,jQuery对象,或者HTML片段,用来包住匹配元素的内容
例:$('div').wrapInner(function() {
return '<p></p>';
})
学累了吧,来点实惠的?
1+1=?
不要往下看了,下面真的没内容了
.......
.......
哈哈 ,适可而止吧
*请认真填写需求信息,我们会在24小时内与您取得联系。