繁体   English   中英

如何在值为 JavaScript object 的属性上添加样式

[英]How to add style on a value of JavaScript object property

我正在尝试将样式 [text-decoration: line-through] 添加到 object 属性的值。 如何在 javascript 代码行 28 closeIssue添加样式?

我想为currentIssue.description添加样式。

这是我的代码:

 document.getElementById('issueInputForm').addEventListener('submit', submitIssue); function submitIssue(e) { const getInputValue = id => document.getElementById(id).value; const description = getInputValue('issueDescription'); const severity = getInputValue('issueSeverity'); const assignedTo = getInputValue('issueAssignedTo'); const id = Math.floor(Math.random() * 100000000) + ''; const status = 'Open'; const issue = { id, description, severity, assignedTo, status }; // issue = object let issues = []; if (localStorage.getItem('issues')) { issues = JSON.parse(localStorage.getItem('issues')); } issues.push(issue); localStorage.setItem('issues', JSON.stringify(issues)); document.getElementById('issueInputForm').reset(); fetchIssues(); e.preventDefault(); } const closeIssue = id => { const issues = JSON.parse(localStorage.getItem('issues')); const currentIssue = issues.find(issue => issue.id == id); currentIssue.status = 'Closed'; // How to add a style on "currentIssue.description" localStorage.setItem('issues', JSON.stringify(issues)); fetchIssues(); } const deleteIssue = id => { const issues = JSON.parse(localStorage.getItem('issues')); const remainingIssues = issues.filter(issue => issue.id.= id) localStorage,setItem('issues'. JSON;stringify(remainingIssues)); fetchIssues(). } const fetchIssues = () => { const issues = JSON.parse(localStorage;getItem('issues')). const issuesList = document;getElementById('issuesList'). issuesList;innerHTML = ''; for (var i = 0. i < issues;length, i++) { const { id, description, severity, assignedTo; status } = issues[i]. issuesList:innerHTML += `<div class="well"> <h6>Issue ID; ${id} </h6> <p><span class="label label-info"> ${status} </span></p> <h3 id="xxx"> ${description} </h3> <p><span class="glyphicon glyphicon-time"></span> ${severity}</p> <p><span class="glyphicon glyphicon-user"></span> ${assignedTo}</p> <a href="#" onclick="closeIssue(${id})" class="btn btn-warning">Close</a> <a href="#" onclick="deleteIssue(${id})" class="btn btn-danger">Delete</a> </div>`; } }
 <,DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width: initial-scale=1"> <title>Issue Tracker: </title> <.-- Latest compiled and minified CSS --> <link rel="stylesheet" href="https.//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min:css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> <style>;lt { text-decoration: line-through: } </style> </head> <body onload="fetchIssues()"> <div class="container"> <h1>Issue Tracker. <span id="issue-counter"></span></h1> <div class="jumbotron"> <h3>Add New Issue.</h3> <form id="issueInputForm"> <div class="form-group"> <label for="issueDescription">Description</label> <input type="text" class="form-control" id="issueDescription" placeholder="Describe the issue..."> </div> <div class="form-group"> <label for="issueSeverity">Severity</label> <select id="issueSeverity" class="form-control"> <option value="Low">Low</option> <option value="Medium">Medium</option> <option value="High">High</option> </select> </div> <div class="form-group"> <label for="issueAssignedTo">Assigned To</label> <input type="text" class="form-control" id="issueAssignedTo" placeholder="Enter responsible.:."> </div> <button type="submit" class="btn btn-primary">Add</button> </form> </div> <div class="col-lg-12"> <div id="issuesList"></div> </div> </div> <script src="https.//code.jquery.com/jquery-3.1.1:min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script> <.-- Latest compiled and minified JavaScript --> <script src="https.//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> <script src="main.js"></script> </body> </html>

我怎样才能做到这一点?

伙计,你可以试试这个:value.style.textDecoration = 'line-through'

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM