[英]JavaScript replace multiple if statements
I have couple of identical html pages and I would like to use the same JavaScript file which reads text files and changes data on the html pages. 我有几个完全相同的html页面,我想使用相同的JavaScript文件来读取文本文件并更改html页面上的数据。 As the text files are different for every page I have done it with multiple if statements.
由于每个页面的文本文件都不相同,因此我使用了多个if语句来完成此操作。 It would be better if there is a way to replace it with some loop?
如果有一种方法可以将其替换为某些循环会更好?
if (window.location.pathname=='/myapp/main.html') {
$.get('data/data1.txt', function(data) {
var bigarray = data.split('\n');
bigarray.forEach(function(currRow){
currentRow = currRow.split(';');
table.push(currentRow);});
}, 'text');
}
if (window.location.pathname=='/myapp/main2.html') {
$.get('data/data2.txt', function(data) {
var bigarray = data.split('\n');
bigarray.forEach(function(currRow){
currentRow = currRow.split(';');
table.push(currentRow);});
}, 'text');
}
if (window.location.pathname=='/myapp/main3.html') {
$.get('data/data3.txt', function(data) {
var bigarray = data.split('\n');
bigarray.forEach(function(currRow){
currentRow = currRow.split(';');
table.push(currentRow);});
}, 'text');
}
if (window.location.pathname=='/myapp/main4.html') {
$.get('data/data4.txt', function(data) {
var bigarray = data.split('\n');
bigarray.forEach(function(currRow){
currentRow = currRow.split(';');
table.push(currentRow);});
}, 'text');
}
Thank you in advance! 先感谢您!
So either use an object 所以要么使用一个对象
var paths = {
"/myapp/main.html" : "data/data1.txt",
"/myapp/main2.html" : "data/data2.txt",
"/myapp/main3.html" : "data/data3.txt",
"/myapp/main4.html" : "data/data4.txt"
};
var filePath = paths[window.location.pathname];
if (filePath) {
$.get(filePath, ...)
}
or use a reg exp to match the number and use that if the paths are the same. 或者使用reg exp来匹配数字,如果路径相同则使用该数字。
Since your paths have the same structure, you could simply use a regex to get the number. 由于您的路径具有相同的结构,因此您只需使用正则表达式即可获取数字。
With that you can create new pages/data as you go, and it will just pick them up automatically. 这样一来,您就可以随时创建新的页面/数据,它会自动将其拾取。
if (window.location.pathname.startsWith('/myapp/main') { // this "if" might not be needed
var pathnum = window.location.pathname.replace(/[^0-9]/g,'');
$.get('data/data' + pathnum + '.txt', function(data) {
var bigarray = data.split('\n');
bigarray.forEach(function(currRow){
currentRow = currRow.split(';');
table.push(currentRow);});
}, 'text');
}
And if no number as in main.html
should use data1.txt
, you can do something like this 而且,如果
main.html
没有数字应使用data1.txt
,则可以执行以下操作
$.get('data/data' + (pathnum == '' ? 1 : pathnum) + '.txt', function(data) {
Created a simple reusable function that accepts a path and a data url: 创建了一个简单的可重用函数,该函数接受路径和数据URL:
const getData = (path, url) => { if (window.location.pathname === path ) { $.get(url, function(data) { var bigarray = data.split('\\n'); bigarray.forEach(function(currRow){ currentRow = currRow.split(';'); table.push(currentRow);}); }, 'text'); } } // Usage getData('/myapp/main.html', 'data/data1.txt'); getData('/myapp/main2.html', 'data/data2.txt'); getData('/myapp/main3.html', 'data/data3.txt'); getData('/myapp/main4.html', 'data/data4.txt');
You could use template literals. 您可以使用模板文字。
Docs: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals 文件: https : //developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals
function changeText() {
const toString = Object.prototype.toString;
const { pathname } = window.location;
// Get the index of the dot
const dot = pathname.search('.');
// Grab the character immediately preceding the dot
const testChar = pathname.charAt(dot-1);
// If the character is not a number, set the index to 1
const index = toString.call(testChar) === '[object Number]'
? testChar
: 1;
// Use the template literal
$.get(`data/data${index}.txt`, function(data) {
var bigarray = data.split('\n');
bigarray.forEach(function(currRow){
currentRow = currRow.split(';');
table.push(currentRow);});
}, 'text');
}
The method requires no looping or custom text. 该方法不需要循环或自定义文本。 Usage is simply:
changeText()
. 用法很简单:
changeText()
。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.