我為我的網(wǎng)站制作了一個(gè)導(dǎo)航欄，但我希望能夠通過(guò)在 JS 中編輯一些代碼來(lái)更新我網(wǎng)站上的所有導(dǎo)航欄。請(qǐng)注意，我對(duì) JS 的了解非常差，而且我承認(rèn)用 JavaScript 可能做不到。這是 HTML 代碼。nav { list-style-type: none; background-color: lightblue; border: 1px solid black; width: fit-content; height: min-content; position: fixed;}nav li { float: left;}nav img { height: 47px; display: block; margin-left: auto; margin-right: auto;}nav li a { display: block; color: black; text-align: center; padding: 14px 16px; text-decoration: none; font-family: -apple-system; background-color: lightblue;}nav li a:hover { background-color: blue; color: white;}nav .nohover:hover { color: white;}<nav class="container"> <li><img src="image" class="navimg"></li> <li><a href="website1">website1</a></li> <li><a href="webite2">website2</a></li> <li><a href="website3">website3</a></li></nav>這些信息將會(huì)非常有幫助。如果您知道該怎么做，請(qǐng)告訴我。
2 回答
米琪卡哇伊
TA貢獻(xiàn)1998條經(jīng)驗(yàn) 獲得超6個(gè)贊
對(duì)我來(lái)說(shuō)，不太清楚你想要什么，但如果你想更改鏈接，你可以使用它。我還為a標(biāo)簽提供了一個(gè)類，以便我可以使用 JQuery 代碼調(diào)用它們！
編輯： 我們是一個(gè)幫助您解決編碼問(wèn)題的社區(qū)，而不是為您編寫整個(gè)代碼。因此，請(qǐng)?jiān)诨卮?StackOverflow 上的下一個(gè)問(wèn)題時(shí)牢記這一點(diǎn)。
編輯2：我保留css了代碼，因?yàn)樗幌嚓P(guān)。
$(document).ready(function() {
$('.link1').parent().html('<a class="link1" href="changed1">changed1</a>');
$('.link2').parent().html('<a class="link2" href="changed2">changed2</a>');
$('.link3').parent().html('<a class="link3" href="changed3">changed3</a>');
// if you want to add a new item to the end
$('li:last').append('<li><a class="link4" href="changed4">changed4</a></li>')
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<nav class="container">
<li><img src="image" class="navimg"></li>
<li><a class="link1" href="website1">website1</a></li>
<li><a class="link2" href="webite2">website2</a></li>
<li><a class="link3" href="website3">website3</a></li>
</nav>
慕虎7371278
TA貢獻(xiàn)1802條經(jīng)驗(yàn) 獲得超4個(gè)贊
刪除 HTML 部分并在 js 文件中添加以下代碼。您所要做的就是編輯 menuArray。只需填充您想要的數(shù)量即可。
var menuArray = ['website1', 'website2', 'website3']
var navdiv = document.createElement("div");
navdiv.setAttribute('class', 'container')
var ul = document.createElement("ul");
menuArray.forEach((ele) => {
var li = document.createElement("li");
li.innerHTML = ele
ul.appendChild(li)
})
navdiv.appendChild(ul)
document.body.prepend(navdiv);
- 2 回答
- 0 關(guān)注
- 158 瀏覽
添加回答
舉報(bào)
0/150
提交
取消