我如何添加一个类到特定的html元素,如果他们包含一个特定的值

How do I add a class to specific html elements, If they contain a certain value

本文关键字:包含一 html 元素 如果 他们 何添加 添加 一个      更新时间:2023-09-26

例如,我有下面的html:

<div id="stuff">
<span>1</span><span>2</span><span>3</span>
</div>

我需要这样选择一些:

$('#stuff').find('<span>1</span><span>2</span>').addClass('2');

这应该把html变成这样:

   <div id="stuff">
    <span class="2">1</span><span class="2">2</span><span>3</span>
    </div>

然而,上面的方法不起作用。有人知道如何使用jQuery来选择的东西直接从DOM通过寻找html?

同样,span's必须按顺序选择,所以如果我有这个:

<div id="stuff">
<span>2</span><span>3</span><span>1</span>
</div>

并使用上面的JS,它不会做任何事情

使用$( '#stuff span:not(:contains(3))' ).addClass( '2' )

正确,如果您想查找各种内容,请执行以下操作:

<html>
   <head>
          <script type="text/javascript" src="http://code.jquery.com/jquery.js"></script>
          <script type="text/javascript">
          $(function(){
                 var contains = [ 1 , 2 , 6 , 7 , 8 ] ;
                 $.map ( contains, function ( i ) {
                        $ ( '#stuff span:contains("'+ i +'")' ).addClass ( '2' ) ;
                 } ) ;
          });
          </script>
   </head>
   <body>
          <div id="stuff">
                 <span>1</span>
                 <span>2</span>
                 <span>3</span>
                 <span>4</span>
                 <span>5</span>
                 <span>6</span>
                 <span>7</span>
                 <span>8</span>
          </div>
   </body>

输出:

<div id="stuff">
       <span class="2">1</span>
       <span class="2">2</span>
       <span>3</span>
       <span>4</span>
       <span>5</span>
       <span class="2">6</span>
       <span class="2">7</span>
       <span class="2">8</span>
</div>

您可以使用:contains伪类:

$('#stuff span:contains(1), #stuff span:contains(2)').addClass('2');
http://jsfiddle.net/SJxTu/

我不完全清楚你的选择条件是什么,但是你可以使用jquery过滤器方法和一个函数来选择跨度。

例如来自文档:

$('li').filter(function(index) {
   return $('strong', this).length == 1;
}).css('background-color', 'red');
http://api.jquery.com/filter/

您需要检查$(this).text() === whatever