Считайте данные из текстового файла и вставьте их на веб-страницу HTML.Как? - PullRequest
Новая
       3

Считайте данные из текстового файла и вставьте их на веб-страницу HTML.Как?

2 голосов
/ 18 мая 2019

У меня есть такой HTML-файл .. 

<html>
<body>
<table border="1" cellpadding="5">
<tr>
<td>Some Fixed text here</td>
<td id="data">---here data as per values in external text file---</td>
</tr>
</table>
</html>

Теперь у меня есть текстовый файл data.txt в том же каталоге файла index.html .

Я должен прочитать текстовый файл, используя некоторые сценарии и поместить фиксированный innerHTML в id = data согласно значениям в первом символе текстового файла .

Например

для 0 в первом символе, innerHTML = <div style="color:red; border:2px dotted blue;">Alpha</div>

для 1 в первом символе, innerHTML = <div>Beta</div>

для 2 в первом символе, innerHTML = <div>Gamma<span>more text</span></div>

и т.д ...

Я нашел различные скрипты, которые использовали jquery, ajax. Я попробовал те, и они не работали для меня. Поскольку у меня мало знаний об этих технологиях, я не могу найти проблему. Может ли кто-нибудь помочь мне сделать сценарий с использованием JavaScript или аналогичного?

Ответы [ 2 ]

0 голосов
/ 18 мая 2019

Загрузка и сохранение текста в переменную в JavaScript : 

var text = new XMLHttpRequest();
text.open('GET', '/data.txt');
text.onreadystatechange = function() {
  alert(text.responseText);
}
text.send();

Или загрузить на страницу, используя PHP (проще ИМХО): 

<div><p><?php include('data.txt'); ?></p></div>
0 голосов
/ 18 мая 2019

Решение jQuery для простого текстового файла, проверка первого символа текста в файле: 

$( function(){
    $.ajax({
        url: 'data.txt',
        type: 'get',
        success: function(data) {
            if (data.substr(0,1) == 0)
                {$("#data").html('<div style="color:red; border:2px dotted blue;">Alpha</div>');}
            if (data.substr(0,1) == 1)
                {$("#data").html('<div>Beta</div>');}
        },
    });
});

Вам просто нужно добавить все остальные условия, которые вы хотите проверить.

Edit:

На всякий случай, если вы не знаете, вы должны добавить это в свой HTML-документ, если вы используете код jQuery. 

<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...