我最近创建了一个连接两个单词的网站,为人们创建一个简单的域名。 我想知道如何将ID设置为粗体,以便我可以将变量“材料”放入其中。我希望这些可以更改,以便人们可以从我放入HTML的两个下拉菜单中选择。这可能听起来像一个奇怪的请求,但这是因为我对JavaScript很新,我知之甚少。感谢您的时间。 : - )
我的JAVASCRIPT:
var places = ["island","moon","mars","vacation","house","yard","hole","library","cave","sun","sandpit","swing","park","ground","sky","land"];
var object = ["ball","toaster","wheel","bike","chair","cup","pole","zip","cake","cheese","microphone","stapler","macaroni","bucket","vacuum","vest","antelope","zucchini","knee","nail","nose","toe","paper","envelope","wood","yogurt"];
var material = ["stone","velvet","silk","cotton","carpet","denim","nylon","leather"];
function randomName() {
var name = places[Math.floor( Math.random()*places.length )] + object[Math.floor( Math.random()*object.length )] + ".com";
document.getElementById("output").innerHTML = name;
}
我的HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
<h1 id="header">Randoma.in</h1>
<div id="span">
<select id="dropdown1">
<option value="places">Places</option>
<option value="objects">Objects</option>
</select>
<select id="dropdown2">
<option value="places">Places</option>
<option value="objects">Objects</option>
</select>
</div>
<button onclick="randomName()" id="button">Generate Domain</button>
<div id="output"></div>
<div class="footer"></div>
</body>
</html>
为什么不;我的CSS:
body{
background-color: #105B63;
}
#header {
text-align: center;
color: #f1f1f1;
}
#output {
background-color:#ffffff;
border: 2px solid #333;
border-radius:4px;
text-align: center;
height: 60px;
width: 300px;
margin-top: 90px;
margin-left: auto;
margin-right: auto;
padding-top: 30px;
font-size: 24px;
color: #333;
}
#button {
font-size: 24px;
display:block;
margin-left: auto;
margin-right: auto;
padding: 10px 15px;
background: #FFD34E;
color: #333;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
border: solid 2px #333;
}
#button:hover {
background: #F2C84A;
border: solid 2px #333;
text-decoration: none;
}
#span {
margin-left: auto;
margin-right: auto;
width: 500px;
}
#dropdown1{
position: absolute;
left: 25%;
}
#dropdown2{
position: absolute;
right 25%;
}
.footer {
position:absolute;
bottom:0px;
width: 100%;
margin: 0;
background-color: #FFFAD5;
height: 200px;
答案 0 :(得分:1)
你可以尝试:
document.getElementById("elementname").value = variableName
在您的JavaScript代码中。