发表于： 2023-04-11 20:42:08
0 240
//1、导入 fs 模块 来操作文件
const fs = require('fs')
//2、调用 fs.readFile()方法读取文件
// 参数1：读取文件的存放路径
// 参数2：读取文件时采用的编码格式，一般默认指定 utf8
// 参数3：回调函数，拿到读取失败和成功的结果 err dataStr
fs.readFile('./files/11.txt', 'utf8', function (err, dataStr) {
if (err) {
return console.log('读取文件失败！' + err.message);
} else {
console.log('读取文件成功！' + dataStr);
}
})
// __dirname 表示 当前文件所处的目录
const fs = require('fs')
fs.readFile(__dirname + '/files/1.txt', 'utf-8', function(err, dataStr) {
if(err) {
return console.log('读取文件失败！' + err.message);
}
console.log('读取文件成功！' + dataStr);
})
//使用path.extname)方法，可以获取路径中的扩展名部分
const path = require('path')
const fpath = '/a/b/c/index.html' //文件存放路径
const fext = path.extname(fpath)
console.log(fext); // .html
// 使用path.join()方法，可以把多个路径片段拼接为完整的路径字符串
const path = require('path')
const fs = require('fs')
// 注意 ../ 会抵消前面的路径
// const pathStr = path.join('/a', '/b/c', '../', '/d', '/e')
// const pathStr1 = path.join('/a', '/b/c', '../../', '/d', '/e')
// console.log(pathStr); // \a\b\d\e
// console.log(pathStr1); // \a\d\e
// fs.readFile(__dirname + './files/1.txt') 这里多个.会判断错误
fs.readFile(path.join(__dirname, './files/1.txt'), 'utf8', function (err, dataStr) {
if(err) {
return console.log(err.message);
}
console.log(dataStr);
})
// 使用path.basename()方法，可以获取路径中的最后一部分，经常通过这个方法获取路径中的文件名
const path = require('path')
//定义文件的存放路径
const fpath = '/a/b/c/index.html' //文件存放路径
// const fullName = path.basename(fpath)
// console.log(fullName); // index.html
const nameWithout = path.basename(fpath, '.html')
console.log(nameWithout); // index
// 1、导入fs文件系统模块
const fs = require('fs')
// 2、调用 fs.readFile() 读取文件的内容
fs.readFile('./files/成绩.txt', 'utf-8', function(err, dataSar) {
// 判断读取是否成功
if(err) {
return console.log('读取文件失败!' + err.message);
}
// console.log('读取文件成功！' + dataSar);
//4.1、先把成绩的数据，按照空格进行分割
const arrOld = dataSar.split(' ')
// console.log(arrOld);
//4.2、循环分割的数字，对每一项数据，进行字符串替换操作
const arrNew = []
arrOld.forEach(item => {
arrNew.push(item.replace('=', ':'))
})
// console.log(arrNew);
//4.3、把新数组中的 每一项，进行合并，得到一个新的字符串
const newStr = arrNew.join('\r\n') // \r\n代表回车换行的意思
// console.log(newSta);
//5、调用 fs.writeFiles(), 把处理完毕的成绩，写入到新文件中
fs.writeFile('./files/成绩-ok.txt', newStr, function(err) {
if(err) {
return console.log('写入文件失败！' + err.message);
}
console.log('成绩写入成功!');
})
})
<
!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>时钟首页</title>
<style>
html,
baby {
margin: 0;
padding: 0;
height: 100%;
background-image: linear-gradient(to bottom right, red, gold);
}
.box {
width: 400px;
height: 250px;
background-color: rgba(255, 255, 255, 0.6);
border-radius: 6px;
position: absolute;
left: 50%;
top: 40%;
transform: translate(-50%, -50%);
box-shadow: 1px 1px 10px #fff;
text-shadow: 0px 1px 30px white;
display: flex;
justify-content: space-around;
align-items: center;
font-size: 70px;
user-select: none;
padding: 0 20px;
/* 盒子投影*/
-webkit-box-reflect: below 0px -webkit-gradient(linear, left top, left bottom, from(transparent),
color-stop(0%, transparent), to(rgba(250, 250, 250, .2)));
}
</style>
</head>
<body>
<div class="box">
<div id="HH">00</div>
<div>:</div>
<div id="mm">00</div>
<div>:</div>
<div id="ss">00</div>
</div>
<script>
window.onload = function () {
// 定时器，每隔1秒执行1次
setInterval(() => {
var dt = new Date()
var HH = dt.getHours()
var mm = dt.getMinutes()
var ss = dt.getSeconds()
// 为页面上的元素赋值
document.querySelector('#HH').innerHTML = padZero(HH)
document.querySelector('#mm').innerHTML = padZero(mm)
document.querySelector('#ss').innerHTML = padZero(ss)
}, 1000)
}
// 补零函数
function padZero(n) {
return n > 9 ? n : '0' + n
}
</script>
</body>
</html>
// 1.1 打入 fs模块
const { log } = require('console')
const fs = require('fs')
// 1.2 导入 path 模块
const path = require('path')
//1.3 定义正则表达式 分别匹配 <style></style> 和 <script></script> 标签
// 其中 s表示空白字符; S表示非空白字符; *表示匹配任意次
const regStyle = /<style>[\s\S]*<\/style>/
const regScript = /<script>[\s\S]*<\/script>/
//2.1 调用fs.readFile()方法读取文件
fs.readFile(path.join(__dirname, '/node案例练习/01-时钟案例.html'), 'utf-8', (err, dataStr)=> {
// 2.2 读取 html文件失败
if(err) return console.log('读取文件失败！' + err.message);
// 2.3 读取文件成功后，调用对应的三个方法，分别拆解css，js，html 文件
// console.log('读取成功');
resolveCss(dataStr)
resolveJs(dataStr)
resolveHtml(dataStr)
})
//3.1 定义处理 css 样式的方法
function resolveCss(htmlStr) {
//3.2 使用正则提取需要的内容
const r1 = regStyle.exec(htmlStr)
// console.log(rl);
//3.3 将提取出来的样式字符串，进行字符串的 replace 替换操作
const newCss = r1[0].replace('<style>', '').replace('</style>', '')
// console.log(newCss);
//3.4 调用 fs.witeFile()方法 将提取的样式，写入到clock的目录中 时钟.css文件里面
fs.writeFile(path.join(__dirname, '/clock/时钟.css'), newCss, function(err) {
if(err) return console.log('写入 css 样式失败！' + err.message);
console.log('写入css样式成功！');
})
}
//4.1 定义处理 js 样式的方法
function resolveJs(htmlStr) {
//4.2 使用正则提取需要的内容
const r2 = regScript.exec(htmlStr)
// console.log(rl);
//4.3 将提取出来的样式字符串，进行字符串的 replace 替换操作
const newJs = r2[0].replace('<script>', '').replace('</script>', '')
// console.log(newCss);
//4.4 调用 fs.witeFile()方法 将提取的样式，写入到clock的目录中 时钟.css文件里面
fs.writeFile(path.join(__dirname, '/clock/时钟.js'), newJs, function(err) {
if(err) return console.log('写入 js 样式失败！' + err.message);
console.log('写入js样式成功！');
})
}
//5.1 定义 html 样式的方法
function resolveHtml(htmlStr) {
//5.2 将字符串调用 replace方法 把内嵌的 style 和 script 标签，替换为外联的link 和 script标签
const newHtml = htmlStr.replace(regStyle, '<link rel="stylesheet" href="./时钟.css"/>')
.replace(regScript, '<script src="./时钟.js"')
//5.3 写入 时钟.html 这个文件
fs.writeFile(path.join(__dirname, './clock/时钟.html'), newHtml, function(err) {
if(err) return console.log('写入html样式失败！' + err.message);
console.log('写入html文件成功！');
})
}
返回列表
评论