이에 대한 많은 해결책이 있지만 html 웹 페이지의 javascript에서 거의 또는 전혀 발견하지 못했습니다. 내 html 파일이있는 곳에 sample.txt라는 데이터 파일이 있습니다. 내 목표는 테이블을 만들고 html 파일에 표시하는 데 사용할 수있는 배열에 txt 파일을로드하는 것입니다. 내 sample.text 파일에는 다음 데이터가 있습니다.
sin 0.2 time 0.22222
cos 0.3 time 0.43434
tan 0.1 time 0.22221
저는 Javascript를 처음 접했으며 다른 프로그래밍 언어보다 어렵다는 것을 인정합니다. 나는 node.js 모드의 자바 스크립트에 익숙하지만 html 모드는 아닙니다. html 웹 페이지 (아래 그림 참조)를 만들고 스크립트 모드에서 텍스트 및 숫자와 같은 기본 사항을 표시했습니다. 또한 스크립트 모드에서 버튼을 누른 후 txt 파일을로드하고 표시 할 수있었습니다. 이 txt로드 방법은 나를 위해 일한 유일한 방법이었습니다. require (js) 메소드가 작동하지 않거나 가져 오지 않았습니다. 이 작업 모드에서 데이터 배열을 어떻게 생성합니까?
아래는 내 전체 코드 (수정 됨)입니다.
<!DOCTYPE html>
<html>
<head>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
<meta content="utf-8" http-equiv="encoding">
<title>Read Text File</title>
</head>
<body>
<input type="file" name="inputfile"
id="inputfile">
<br>
<pre id="output"></pre>
<script>
var file = document.getElementById('inputfile');
file.addEventListener('change', () => {
var txtArr = [];
var fr = new FileReader();
fr.onload = function() {
// By lines
var lines = this.result.split('\n');
for (var line = 0; line < lines.length; line++) {
txtArr = [...txtArr, ...(lines[line].split(" "))];
}
}
fr.onloadend = function() {
console.log(txtArr);
document.getElementById('output').textContent=txtArr.join("");
document.getElementById("output").innerHTML = txtArr[1];
console.log(txtArr[1]);
}
fr.readAsText(file.files[0]);
})
</script>
</body>
</html>
를 사용 FileReader
하여 문자열을 한 줄씩 가져온 다음 분할하고 다음과 같이 resultArr에 병합합니다.
var file = document.getElementById('inputfile');
file.addEventListener('change', () => {
var txtArr = [];
var fr = new FileReader();
fr.onload = function() {
// By lines
var lines = this.result.split('\n');
for (var line = 0; line < lines.length; line++) {
txtArr = [...txtArr, ...(lines[line].split(" "))];
}
}
fr.onloadend = function() {
console.log(txtArr);
document.getElementById('output').textContent=txtArr.join("");
}
fr.readAsText(file.files[0]);
})
<!DOCTYPE html>
<html>
<head>
<title>Read Text File</title>
</head>
<body>
<input type="file" name="inputfile"
id="inputfile">
<br>
<pre id="output"></pre>
</body>
</html>
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다