將值從 JavaScript 傳遞/顯示到 HTML 頁面

Question

我有以下 JS 代碼，它使用本地存儲來顯示之前輸入的“姓名”和“年齡”：

此 HTML 代碼當前在表格中顯示某人的日期、時間、姓名和年齡。 我如何傳遞這些值以作為標簽而不是在該表中顯示在 HTML 表單中？

HTML 僅帶回開始時間，不顯示姓名和年齡：

 <div id="history_list"></div>
    <div id="name"> </div>
    <div id="age"></div>

JS：

    function loadHistoryList() {

        for(var i = numberOfHistory; i >= 1; i--) {
            var historyData = new historyElement(db.getItem(i.toString()));

            if(historyData === null) {
                console.error('error');
                continue;
            }
            $('#history_list').append(historyData.startTime);
            $('#name').append(historyData.name);
            $('#age').append(historyData.age);
        }
    }

Answer 1

代替

var div = '<div id="history_element"><div id="element_title">' + historyData.startDate + '&nbsp;&nbsp;&nbsp;' + historyData.startTime + '</div><table>';
var div = '<div id="name"><tr><td>name: </td><td>' + historyData.name+ '</td></tr>';
var div = '<div id="age"><tr><td>age: </td><td>' + historyData.age+ '</td></tr>';

div += '</table></div>';

$('#history_list').append(div);
$('#name').append(div);
$('#age').append(div);

做這個：

$('#history_list').append(historyData.startTime);
$('#name').append(historyData.name);
$('#age').append(historyData.age);

簡而言之：您可以（並且在這種情況下應該）簡單地將所需的值添加到容器（DIV、表單字段或諸如此類）

以var div (...)開頭的那三行覆蓋了之前的每一行，但這是一個旁注。
總的來說，您應該閱讀更多關於 JavaScript 和/或 JQuery 的內容。

Answer 2

填充表單域 首先，您必須添加一個表單元素，如輸入域

HTML

<div id="history_list">
</div>
<input type="text" id="name" name="name">

JS

function loadHistoryList() {

for(var i = numberOfHistory; i >= 1; i--) {
        var historyData = new historyElement(db.getItem(i.toString()));

        if(historyData === null) {
            console.error('error');
            continue;
        }
        $('#name').val(historyData.name);
    }

}