blocks|key|1324120|text|尝尝这个。有关更多详细信息，请参阅jquery+selectors|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1324121|$('*[class%5E="text"]')|code-block|syntax|javascript|1324122|entityMap|0|LINK|mutability|MUTABLE|url|http://api.jquery.com/attribute-starts-with-selector/^0|H|G|H|G|0|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@$9|T|A|U|B|C]]|D|@$9|V|A|W|1|X]]|E|$]]|$1|F|3|G|5|H|7|Y|8|@]|D|@]|E|$I|J]]|$1|K|3|-4|5|6|7|Z|8|@]|D|@]|E|$]]]|L|$M|$5|N|O|P|E|$Q|R]]]]

<p>Try this. For more details refer <a href="http://api.jquery.com/attribute-starts-with-selector/" rel="noreferrer"><code>jquery selectors</code></a></p>

<pre><code>$('*[class^="text"]')
</code></pre>


blocks|key|1322325|text|这里尝试了一种既准确又不太慢的解决方案：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1322326|var+elts+=+$('*[class*="text-"]')
++.filter(function+()+{
++++return+this.className.match(/(?:%5E%7C\s)text-/);
++});|code-block|syntax|javascript|1322327|它的工作方式是(希望)使用快速的Sizzle代码来查找在class属性中任何位置都有"text-“的元素，然后对每个元素调用一个函数，将它们过滤到类名称开头实际有"text-”的元素。|offset|length|style|CODE|1322328|entityMap^0|0|0|S|5|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|Q|8|@$I|R|J|S|K|L]]|9|@]|A|$]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

<p>Here's an attempt at a solution that's both accurate and not too slow:</p>

<pre><code>var elts = $('*[class*="text-"]')
  .filter(function () {
    return this.className.match(/(?:^|\s)text-/);
  });
</code></pre>

<p>Which works by using the (hopefully) fast Sizzle code to find elements that have "text-" anywhere in their <code>class</code> attribute, and then calls a function on each of those to filter them down to the ones that actually have "text-" at the beginning of a class name.</p>


blocks|key|3609737|text|您不一定需要指定星号*，您也可以这样做：|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|3609738|$('[class%5E="text-"]')|code-block|syntax|javascript|3609739|请注意，在text之后添加了-，这是您要查找的内容。|3609740|有关更多信息，请查看jQuery+starts+with+selector。|3609741|entityMap|0|LINK|mutability|MUTABLE|url|http://api.jquery.com/attribute-starts-with-selector/^0|A|1|0|0|5|4|E|1|0|A|R|0|0^^$0|@$1|2|3|4|5|6|7|W|8|@$9|X|A|Y|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|Z|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|10|8|@$9|11|A|12|B|C]|$9|13|A|14|B|C]]|D|@]|E|$]]|$1|M|3|N|5|6|7|15|8|@]|D|@$9|16|A|17|1|18]]|E|$]]|$1|O|3|-4|5|6|7|19|8|@]|D|@]|E|$]]]|P|$Q|$5|R|S|T|E|$U|V]]]]

<p>You don't necessarily need to specify asterisk <code>*</code>, you can do this too:</p>

<pre><code>$('[class^="text-"]')
</code></pre>

<p>Notice the addition of <code>-</code> after <code>text</code> something you are looking for.</p>

<p>Check out the <a href="http://api.jquery.com/attribute-starts-with-selector/" rel="nofollow">jQuery starts with selector</a> for more information.</p>


blocks|key|5020976|text|只需在一个函数调用中使用两个选择器即可完成此操作：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|5020977|$('[class%5E="text-"],+[class*="+text-"]')|offset|length|style|CODE|5020978|这将检查类属性是否以text-开头，或者类字符串中是否有后面跟着text-的空格。这解决了您在使用|5020979|​|5020980|$('[class%5E="text-"],+[class*="+text-"]')
++++.css('background-color',+'#00FF00');+//+add+background+color+for+demo|code-block|syntax|javascript|5020981|/*+just+for+demo+*/
div:after+{
++content:+"class:+"+attr(class);
}|5020982|<script+src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div+class="text-1+test"></div>
<div+class="text+some-text-1"></div>
<div+class="nope+text-long-class-name"></div>
<div+class="some-text-1"></div>
<div+class="even+get+text-n-here"></div>|5020983|5020984|您可以将其提取到一个函数中，该函数也可以选择具有与给定前缀匹配的类的所有元素：|5020985|function+selectElementsWithClassPrefix(prefix)+{
++++return+$('[class%5E="'+%2B+prefix+%2B+'"],+[class*="+'+%2B+prefix+%2B+'"]');
}|5020986|entityMap^0|0|0|14|0|A|5|W|5|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|11|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|12|8|@$D|13|E|14|F|G]]|9|@]|A|$]]|$1|H|3|I|5|6|7|15|8|@$D|16|E|17|F|G]|$D|18|E|19|F|G]]|9|@]|A|$]]|$1|J|3|K|5|6|7|1A|8|@]|9|@]|A|$]]|$1|L|3|M|5|N|7|1B|8|@]|9|@]|A|$O|P]]|$1|Q|3|R|5|N|7|1C|8|@]|9|@]|A|$O|P]]|$1|S|3|T|5|N|7|1D|8|@]|9|@]|A|$O|P]]|$1|U|3|K|5|6|7|1E|8|@]|9|@]|A|$]]|$1|V|3|W|5|6|7|1F|8|@]|9|@]|A|$]]|$1|X|3|Y|5|N|7|1G|8|@]|9|@]|A|$O|P]]|$1|Z|3|-4|5|6|7|1H|8|@]|9|@]|A|$]]]|10|$]]

<p>You can do this with just two selectors in one function call: </p>

<p><code>$('[class^="text-"], [class*=" text-"]')</code></p>

<p>This will check if the class attribute starts with <code>text-</code> or if there is any part of the class string that has a space followed by <code>text-</code>. This solves any issues you might have with the </p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>$('[class^="text-"], [class*=" text-"]')
    .css('background-color', '#00FF00'); // add background color for demo</code></pre>
<pre class="snippet-code-css lang-css prettyprint-override"><code>/* just for demo */
div:after {
  content: "class: " attr(class);
}</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;

&lt;div class="text-1 test"&gt;&lt;/div&gt;
&lt;div class="text some-text-1"&gt;&lt;/div&gt;
&lt;div class="nope text-long-class-name"&gt;&lt;/div&gt;
&lt;div class="some-text-1"&gt;&lt;/div&gt;
&lt;div class="even get text-n-here"&gt;&lt;/div&gt;</code></pre>
</div>
</div>
</p>

<p>You could pull this out into a function that selects all elements with a class that matches a given prefix, as well:</p>

<pre><code>function selectElementsWithClassPrefix(prefix) {
    return $('[class^="' + prefix + '"], [class*=" ' + prefix + '"]');
}
</code></pre>


blocks|key|1322270|text|下面是一个处理多个类问题的函数，在<div+class="foo+bar+barfood">这样的情况下|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1322271|function+classStartsWith(str)+{
++return+$('div').map(+function(i,e)+{
++++var+classes+=+e.className.split('+');
++++for+(var+i=0,+j=classes.length;+i+<+j;+i%2B%2B)+{
++++++if+(classes[i].substr(0,+str.length)+==+str)+return+e;
++++}
++}).get();
}|code-block|syntax|javascript|1322272|该函数返回匹配的DOM元素的数组。你可以这样使用它：|1322273|$(+classStartsWith('text-')+).doSomething();|1322274|下面是一个例子：http://www.jsfiddle.net/Ms6ey/3/|1322275|当然，这里假设选择器为'div'。这个问题似乎问的是任何元素。让函数接受选择器作为另一个参数，并用它代替示例中硬编码的选择器，这很容易。|1322276|entityMap|0|LINK|mutability|MUTABLE|url|http://www.jsfiddle.net/Ms6ey/3/^0|H|T|0|0|0|0|8|W|0|0|B|5|0^^$0|@$1|2|3|4|5|6|7|10|8|@$9|11|A|12|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|13|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|14|8|@]|D|@]|E|$]]|$1|M|3|N|5|H|7|15|8|@]|D|@]|E|$I|J]]|$1|O|3|P|5|6|7|16|8|@]|D|@$9|17|A|18|1|19]]|E|$]]|$1|Q|3|R|5|6|7|1A|8|@$9|1B|A|1C|B|C]]|D|@]|E|$]]|$1|S|3|-4|5|6|7|1D|8|@]|D|@]|E|$]]]|T|$U|$5|V|W|X|E|$Y|Z]]]]

<p>Here's a function that deals with the issue of multiple classes, in cases like <code>&lt;div class="foo bar barfood"&gt;</code>:</p>

<pre><code>function classStartsWith(str) {
  return $('div').map( function(i,e) {
    var classes = e.className.split(' ');
    for (var i=0, j=classes.length; i &lt; j; i++) {
      if (classes[i].substr(0, str.length) == str) return e;
    }
  }).get();
}
</code></pre>

<p>The function returns an array of matching DOM elements. You can use it thus:</p>

<pre><code>$( classStartsWith('text-') ).doSomething();
</code></pre>

<p>Here's an example: <a href="http://www.jsfiddle.net/Ms6ey/3/" rel="nofollow">http://www.jsfiddle.net/Ms6ey/3/</a></p>

<p>Of course this assumes the selector <code>'div'</code>. The question seems to be asking about any element at all. It's easy enough to make the function take a selector as another argument, and use that in place of the hardcoded one in the example.</p>


blocks|key|2066378|text|$('#qvDetails,#qvAdd,.qvFramedActive,#qvMoreSizes').live('mouseover',function(){

++++++++$(this).addClass('qvHover');++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

++++});|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|2066379|我的一个projects.you中的示例可以像上面那样同时提到div和类|unstyled|2066380|您可以在相同的.中提供coma分隔类或div|2066381|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$B|C]]|$1|D|3|E|5|F|7|L|8|@]|9|@]|A|$]]|$1|G|3|H|5|F|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|F|7|N|8|@]|9|@]|A|$]]]|J|$]]

<pre><code>$('#qvDetails,#qvAdd,.qvFramedActive,#qvMoreSizes').live('mouseover',function(){

        $(this).addClass('qvHover');                                                                            

    });
</code></pre>

<p>example from one of my projects.you can mention both divs and classes together like above</p>

<p>you can provide as coma separated class or divs in the same...</p>


<p>I have got some classes</p>

<pre><code>.text-1
.text-2
.text-3
</code></pre>

<p>I want to select them all, how to do that?
Thanks for the help</p>


jquery how to select all the class elements start with "text-"?

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

教程

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云智能顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云AI代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

功能1上新10个字符

功能2描述100个字符功能2描述100个字符功能2描述100个字符功能2描述100个字符功能2描述100个字符功能2描述100个字符功能2描述100个字符功能2描述100个字符功能2描述100个字符。

功能2上新100个字符功能2上新100个字符功能2上新100个字符功能2上新100个字符功能2上新100个字符功能2上新100个字符功能2上新100个字符功能2上新100个字符功能2上新100个字符。

功能5描述100个字符功能5描述100个字符功能5描述100个字符功能5描述100个字符功能5描述100个字符功能5描述100个字符

功能5上新100个字符功能5上新100个字符功能5上新100个字符功能5上新100个字符功能5上新100个字符功能5上新100个字符功能5上新100个字符功能5上新100个字符功能5上新100个字符功能5上新100个字符

功能4上新

文章&问答评论现已支持表情

全新交互，全新视觉，新增快捷键、悬浮工具栏、高亮块等功能并同时优化现有功能，全面提升创作效率和体验

社区富文本编辑器全新改版！诚邀体验～ 

精选全网热门MCP server，让你的AI更好用 🚀

💥开发者 MCP广场重磅上线！

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

聚焦“写作效率、视觉美观与运行性能”三方面进行全面升级，为您提供更高效、稳定的创作环境

社区富文本&Markdown编辑器全新改版上线，欢迎大家体验!

诚挚邀请您参与本次调研，分享您的真实使用感受与建议。您的反馈至关重要，感谢您的支持与参与！

社区新版编辑器体验调研

我有几节课.text-1.text-2.text-3我想把它们全部选中，怎么做呢？谢谢你的帮助

问jquery如何选择所有以"text-“开头的类元素？
EN

回答 6

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jquery如何选择所有以"text-“开头的类元素？EN

回答 6

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jquery如何选择所有以"text-“开头的类元素？
EN