添加一个基于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的菜单项

回答

相关问题