添加一個基於jQuery的內部內容的基於jQuery的菜單項

我正在更新客戶端的公司網站，並且我不允許編輯他們的html/css/php。當我需要做一些小改動時，比如在主導航欄中添加或刪除，我必須使用JS覆蓋文件和jQuery。喜歡與否，這是他們的系統。添加一個基於jQuery的內部內容的基於jQuery的菜單項

我需要添加一個簡單的項目到無序列表。針對UL很容易，因爲導航包裝具有ID。我不想使用nth：child，因爲他們希望在兩個特定的其他項目之間使用這個新項目，這可能會改變。沒有一個LI標籤有類或ID。每個LI裏面都有一個鏈接/錨點。我需要能夠根據內部錨點的文本來選擇列表項目。

<div id="nav"> 
<ul> 
    <li><a href="">Something 1</a></li> 
    <li><a href="">Something 2</a></li> 
    // Need to insert here, but only because it must go after 
    Something 2, which itself may change positions in the future. 
    <li><a href="">Something 3</a></li> 
    <li><a href="">Something 4</a></li> 
</ul> 
</div>

使用jQuery，我怎麼能最安全地做到這一點？

來源

2012-10-23 user1729506

這應該做你想要什麼..

$('#nav li').filter(function(){ 
    return $(this).text() == 'Something 2'; 
}).after('<li><a href="">Something new</a></li>');

一個更安全的方式爲了比較將修剪和轉換兩個字符串爲小寫。
另外，你應該在domready中事件

$(function(){ 
    var existingElement = 'Something 2'.toLowerCase(); 
    $('#nav li').filter(function(){ 
     var cleanText = $.trim($(this).text()).toLowerCase(); 
     return cleanText == existingElement; 
    }).after('<li><a href="">Something new</a></li>'); 
});

來源

2012-10-23 15:38:11

看起來很穩固，但由於某種原因沒有工作。 – user1729506

@ user1729506，難道你是用javascript/jquery插入'Something 2'嗎？ –

可能。他們的菜單是動態生成的，但是我的JS應該在加載其他東西后執行。 – user1729506

嘗試......

$("ul#nav li").filter(function() { 
    return $(this).find("a").text() == "Something 2"; 
}).after("<li>your element goes here</li>");

這裏的工作小提琴... http://jsfiddle.net/Sbm7D/

來源

2012-10-23 15:29:42 Archer

與蓋比的，它看起來固體後打電話給你的代碼。它適用於小提琴。但是當我在覆蓋文件中使用它時失敗。假設我需要查找的文本包含版權符號或＆符號，您將如何定位？＆或者&？我認爲它把它看作是一個字符串，又名＆。 – user1729506

添加一個基於jQuery的內部內容的基於jQuery的菜單項

回答

相關問題