代码之家  ›  专栏  ›  技术社区  ›  Gal

如何选择没有用css/jquery标记的文本?

  •  0
  • Gal  · 技术社区  · 16 年前

    我想应用一些css的文本,我不能在跨度标记。例如:

    <li><a href="google.com">This is marked up</a> and this is not </li>
    

    我想选择css(最好)或jquery这一位: and this is not . 也许有一种方法可以选择整个li,然后排除a,这看起来像是一个旁路。

    我不能标记它的原因是因为我正在使用wp,而且我更喜欢这样做,而不是挖掘无休止的php代码行。非常感谢你的帮助。

    编辑: 我要做的是对我要选择的文本位应用“display:none”。我做不到: li {display: none; } 因为那会把整件事都搞定,即使我这么做了

    li a {display: inline; }
    

    这就是为什么我在寻找一种方法,只选择具体的文本。

    我在书页上有很多。

    3 回复  |  直到 16 年前
        1
  •  3
  •   Marcin    16 年前
    //assuming that you have only one li element
    
    var a_text = $('li > a').text();  
    var li_text = $('li').text().replace(a_text,'');
    
    $('li').html($('li').html().replace(li_text,'<span style="background:#000;color:#fff">'+li_text+'</span>'));
    

    对于多个元素:

    //assuming more then one
    
    $('li').each(function(){
        var a_text = $(this).children('a').text();  
        var li_text = $(this).text().replace(a_text,'');
    
        $(this).html($(this).html().replace(li_text,'<span style="background:#000;color:#fff">'+li_text+'</span>'));
    });
    

    干杯, 马尔钦

        2
  •  1
  •   Pekka    16 年前

    我认为没有办法做到这一点,至少不用css。做这个imo最安全的方法是将所有需要的样式应用到 li 元素:

    li { font-size: 18px; ... }
    

    否定一切你不想要的 a 元素:

    li a { font-size: 16px; ... }
    

    (您可能希望使用更多特定的选择器,而不仅仅是 ,可能在它们前面加上父类名称)

    使用jquery,您当然可以在“not marked up”区域包装一个新的标记,但这很复杂,在js关闭的情况下不起作用。我不会那么做的。

        3
  •  0
  •   Dave Anderson    16 年前

    你能把样式应用到 li 元素,然后使用应用于 a 中的元素 元素。

    或许可以创造以下风格;

    li.myListElements { color: #FFF; }
    li.myListElements a { color: #F00; font-weight: bold; }
    

    调整加价;

    <li class="myListElements"><a href="www.google.com">This is marked up</a> and this is not</li>