如何將Javascript變量添加到div以允許從CSS格式化

-1

我的目標是將三個Javascript變量添加到div中以允許從CSS進行格式設置。我如何獲得div的這些物品？如何將Javascript變量添加到div以允許從CSS格式化

function myWindow() 
 
{ 
 
\t visitorEmail = document.getElementById("myEmail").value; 
 
\t var findSymbol = /[@]/g; 
 
\t var result = visitorEmail.match(findSymbol); 
 
\t if (result != "@") { 
 
\t \t document.getElementById("myEmail").focus(); 
 
\t } 
 
\t else { 
 
    \t visitorName = document.getElementById("myName").value; 
 
\t \t visitorAddress = document.getElementById("myAddress").value; 
 
\t \t visitorPhone = document.getElementById("myPhone").value; 
 
\t \t visitorPersonal = document.getElementById("myPersonal").value; 
 
\t \t visitorCareer = document.getElementById("myCareer").value; 
 
\t \t visitorEdu = document.getElementById("myEdu").value; 
 
\t \t visitorEmp1 = document.getElementById("myEmp1").value; 
 
\t \t visitorEmpDets1 = document.getElementById("myEmpDets1").value; 
 
\t \t visitorEmp2 = document.getElementById("myEmp2").value; 
 
\t \t visitorEmpDets2 = document.getElementById("myEmpDets2").value; 
 
\t \t visitorEmp3 = document.getElementById("myEmp3").value; 
 
\t \t visitorEmpDets3 = document.getElementById("myEmpDets3").value; 
 
\t \t visitorEmp4 = document.getElementById("myEmp4").value; 
 
\t \t visitorEmpDets4 = document.getElementById("myEmpDets4").value; 
 
\t \t visitorRef = document.getElementById("myRef").value; 
 
\t \t 
 
    \t myTop = ("<html>\n<head>\n<title>Resume</title>\n</head>\n<body>\n"); 
 
    \t myTop += (visitorName + "<br>"); 
 
\t \t myTop += (visitorAddress + "<br>"); 
 
\t \t myTop += (visitorPhone + "<br>"); 
 
\t \t myTop += (visitorEmail + "<hr>" + "<br>"); 
 
\t \t 
 
\t \t myText = ("<html>\n<head>\n<title>Resume</title>\n</head>\n<body>\n"); 
 
\t \t myText += (visitorPersonal + "<br>"+ "<br>"); 
 
\t \t myText += (visitorCareer + "<br>"+ "<br>"); 
 
\t \t myText += (visitorEdu += "<br>"+ "<br>"); 
 
\t \t myText += (visitorEmp1 += "<br>"); 
 
\t \t myText += (visitorEmpDets1 += "<br>"+ "<br>"); 
 
\t \t myText += (visitorEmp2 += "<br>"); 
 
\t \t myText += (visitorEmpDets2 += "<br>"+ "<br>"); 
 
\t \t myText += (visitorEmp3 += "<br>"); 
 
\t \t myText += (visitorEmpDets3 += "<br>"+ "<br>"); 
 
\t \t myText += (visitorEmp4 += "<br>"); 
 
\t \t myText += (visitorEmpDets4 += "<br>"+ "<br>"); 
 
\t \t myText += (visitorRef += "<br>"); 
 
    \t myText += ("</body>\n</html>"); 
 
\t \t 
 
\t \t myHeadings = ("<html>\n<body>\n"); 
 
\t \t myHeadings += ("PERSONAL INFORMATION"+ "<br>"); 
 
\t \t myHeadings += ("CAREER OBJECTIVES"+ "<br>"); 
 
\t \t myHeadings += ("EDUCATIONAL BACKGROUND"+ "<br>"); 
 
\t \t myHeadings += ("EXPERIENCE"+ "<br>"); 
 
\t \t myHeadings += ("BUSINESS REFERENCES"+ "<br>"); 
 
\t \t 
 
    \t flyWindow = window.open('about:blank','myPop','width=600,height=500,left=200,top=200'); 
 
    \t flyWindow.document.write('<html><head><link rel="stylesheet" type="text/css" href="jsStyles.css" /></head><body><div>' + myTop + myText + '</div></body></html>'); 
 
\t } 
 
}

謝謝！

來源

2017-04-21 Brian Thacker _ Staff - Rolesv

這看起來很像打字。我會將所有那些重複<br>-s與<li>包裝起來。也許我需要編寫函數，它需要一些字符串參數並插入<li>。我會創建你的表單中的字符串數組，並用給定的函數遍歷它們，如下所示：

const array = [visitorName, visitorAddress, visitorPhone...]; 

function createLi(string){ 
    return `<li>${string}</li><br>`; 
} 

array.map(item => createLi(item));

來源

2017-04-21 17:47:10

謝謝！我依稀記得這一點，但現在我有一些研究。 ;-) –

@Brian Thacker _ Staff - Rolesv有一些ES6的東西像[Template literals]（https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals），[箭頭函數]（https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions）和vanilla [Array.prototype.map（）]（https：//developer.mozilla。 org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map？v = example）方法 –

如何將Javascript變量添加到div以允許從CSS格式化

回答

相關問題