setAttribute to var string in Javascript

-4

我想添加到下面的每個var鏈接字符串和我的HTML我唯一的東西是一個簡單的div與ID集。setAttribute to var string in Javascript

var home = "Home"; 
 
var news = "News"; 
 
var contact = "Contact"; 
 
var about = "About"; 
 
document.getElementById("myTopnav").innerHTML = home + " " + news + " " + contact + " " + about;

<div class="topnav" id="myTopnav"> 
 

 
</div>

正如你可以看到它是一個菜單，我想只能創建一個使用JavaScript。

來源

2017-10-21 Andrei Ref

你所說的「一個鏈接字符串，然後進入我的HTML」是什麼意思？鏈接標籤？ – iagowp

我希望每個var都有一個鏈接到一個頁面，就像一個菜單 –

你發佈的鏈接似乎並不關注他@msanford。他想在香草js中做到這一點，而不是jQuery – iagowp

它看起來像你剛剛開始，所以我建議以可維護的方式開始。在列表中定義菜單項，而不是單個變量，然後逐步添加a標記。就像這樣：

var menuItems = [{ 
 
     name:"Home", 
 
     link:"/home" 
 
    }, 
 
    { 
 
     name:"News", 
 
     link:"/news" 
 
    }, 
 
    { 
 
     name:"Contact", 
 
     link:"/contact" 
 
    }, 
 
    { 
 
     name:"About", 
 
     link:"/about" 
 
    }] 
 
var menu = document.getElementById("myTopnav") 
 
for(var i = 0; i < menuItems.length; i++) { 
 
    var link = document.createElement('a'); 
 
    var linkText = document.createTextNode(menuItems[i].name); 
 
    link.appendChild(linkText); 
 
    link.href = menuItems[i].link; 
 
    menu.appendChild(link); 
 
}

#myTopnav a{ 
 
     margin-left: 10px 
 
    }

<div class="topnav" id="myTopnav"></div>

來源

2017-10-21 18:55:29

這太棒了。你是對的，我剛開始:) –

您可以將自己的元素封裝在諸如<a></a> or <li><a></a></li>之類的html標記中。

document.getElementById('myTopnav').innerHTML = '<a href="#">' + home + '</a>' + ...

來源

2017-10-21 18:47:45 sklart

<div class="topnav" id="myTopnav"></div> 

<script> 
var links = [ 
    ['Home', '/'], 
    ['News', '/news/'], 
    ['Contact', '/contact/'], 
    ['About', '/about/'] 
]; 

function makeNav(links) { 
    var nav = document.getElementById('myTopnav'); 
    for (var i = 0; i < links.length; i++) { 
    nav.innerHTML += '<a href="' + links[i][1] + '">' + links[i][0] + '</a>'; 
    } 
    return nav; 
} 

makeNav(links); 
</script>

來源

2017-10-21 19:02:06

我不希望它作爲一個列表。我想正常在1個酒吧 –

好吧。現在編輯到平板清單 –

偉大的工作很好 –

setAttribute to var string in Javascript

回答

相關問題