如何使用jQuery从标签中删除href属性并在iframe中删除与其关联的CSS

Question

我在iframe中有以下一组ID为#nitseditpreview的代码：

<div class="collapse navbar-collapse">
    <ul class="nav navbar-nav navbar-right" id="nitsmenu" data-nitspagelabel="1">
        <li class="scroll active"><a href="#navigation">Home</a></li>
        <li class="scroll"><a href="#aboutus">About Us</a></li>
        <li class="scroll"><a href="#services">Services</a></li>
        <li class="scroll"><a href="#ourteam">Our Team</a></li>
        <li class="scroll"><a href="#portfolio">Portfolio</a></li>
        <li class="scroll"><a href="#clients">Clients</a></li>
        <li class="scroll"><a href="#blog">Blog</a></li>
        <li class="scroll"><a href="#contact">Contact</a></li>
    </ul>
</div>

我想从锚标记中删除href值，并从样式表中提到与之相关联的CSS，即：

CSS：

#navigation .navbar-inverse .navbar-nav  .active  a,  
#navigation .navbar-inverse .navbar-nav  .active  a:focus, 
#navigation .navbar-nav.navbar-right li a:hover {
    color: #fff;
    background-color: #fc7700;
}

我正在使用jquery执行此功能，到目前为止，我可以通过以下方式获取元素：

jQuery的：

$(document).ready(function () {
$('#nitseditpreview').load(function () { //The function below executes once the iframe has finished loading
    var menu = $(this).contents().find('#nitsmenu');
    $(this).contents().find('#nitsmenu' > li);
 }
}

我应该使用每个功能来获得所需的输出吗？

Answer 1

尝试这个：

var all_li;
$(document).ready(function () {
$('#nitseditpreview').load(function () { //The function below executes once the iframe has finished loading
    var menu = $(this).contents().find('#nitsmenu');
    all_li = $(this).contents().find('#nitsmenu' > li);

    jQuery(all_li).find("a").removeAttr("href");
    jQuery(all_li).find("a").css({'color':'#000','background-color':'none' });
 }
}

我添加了这两行

 jQuery(all_li).find("a").removeAttr("href");
 jQuery(all_li).find("a").css({'color':'#000','background-color':'none' });

删除所有href并更改CSS。