Question

我正在尝试在我的JavaScript代码中创建2列布局。这是我需要应用于我的JS代码的CSS：

div#theLeft {
  clear:both;
  width:15%;
  float:left;
}

div#theRight {
  width:83%;
  float:right;
  padding-bottom:20px;
  padding-right:30px;
}

如何将其应用于.js文件中的JavaScript元素？

myText = (" 
<html>\n<head>\n<title>Resume</title>\n</head>\n<body>\n");

myText += (userName+"<br>");  
myText += (address+ " / " +phoneNo +"<br>");
myText += ("<hr width 70%>");

myText += ("PERSONAL\n DETAILS<br>");
myText += ( +personalData+ "<br>");

myText += ("CAREER\n OBJECTIVES<br>"); 
myText += ( +careerObj+"<br>");    

myText += ("EDUCATION<br>");
myText += ( +edubackgrnd+ "<br>");

myText += ("EMPLOYMENT\n EXPERIENCE<br>");    
myText += (fromDate+ " - " +toDate+"<br>");
myText += (experience +"<br>");

myText += (fromDate1+ " - " +toDate1+"<br>");
myText += (experience1 +"<br>");

myText += (fromDate2+ " - " +toDate2+"<br>");
myText += (experience2 +"<br>");

myText += (fromDate3+ " - " +toDate3+"<br>");
myText += (experience3 +"<br>");

myText += ("CHARACTER \n REFERENCES<br>");
myText += ("Upon request<br>");

myText += ("BUSINESS \n REFERENCE<br>");
myText += (busRef);

myText += ("</body>\n</html>");

flyWindow = window.open('about:blank','myPop','width=1000,height=500,left=200,top=200');
flyWindow.document.write(myText);

这是我的JS。如果我理解正确，则可以在JavaScript中的引号（“”）之间添加html标签；正确？

Answer 1

为了将该CSS应用于特定的HTML文件，需要将其包含在<style></style>标签之间的某个位置。作为一种替代方法（也是一种更好的做法），您的CSS应该存储在单独的.css文件中，并使用<link>标签包含在其中，如下所示：

<link rel="stylesheet" type="text/css" href='static/style.css'>

作为另一种选择，如果您想在问题中包含JS的意思是要动态应用该样式（例如在页面上发生事件时），则可以使用jQuery来实现。当然，有一些本机的方法可以做到，但是对于这种事情，我还是更喜欢jQuery。

$("div#theRight")
    .css("width", "83%")
    .css("padding", "float:right")
    .css("padding-bottom", "20px")
    .css("padding-right", "30px");

最后，最好的方法是包含一个如上所述的.css文件，该文件将样式应用于特定类的元素。然后，当您的事件发生时，从您的元素中添加或删除该类，以动态地应用或删除这些样式。

$("div#theRight").addClass("myClass");

$("div#theRight").removeClass("myClass");

希望这会有所帮助。

在JavaScript中向JavaScript元素添加样式

1 个答案: