jQuery选择第一个字母？答案

【问题标题】：Jquery select first letter?jQuery选择第一个字母？
【发布时间】：2025-12-09 04:50:01
【问题描述】：

我只是试图让 jquery 识别段落的第一个字母。我该怎么做？

例如，我有一个页面上有许多段落。我只希望以指定字母开头的段落被赋予“当前”类，而所有其他段落都被隐藏。我几乎知道如何添加类并隐藏其他类，但是我无法让 jquery 识别第一个字母。

其次，是否可以从 url 字符串中提取这个“首字母”变量？

例如，第 1 页 - 有一个字母列表。用户点击“B”，网址为

http://domain.com/page2.html?letter=b

然后 page2 选取该变量 (b) 并将其应用于 Jquery，仅显示那些段落

【问题讨论】：

你会使用像 PHP 这样的服务器端语言来检索$_GET['letter']，还是你也想用 jQuery 来做这件事？
这对我来说真的没关系。我也不反对使用一些 PHP。
我更新了我的答案，以防您选择使用客户端代码处理它。

标签： javascript jquery html query-string

【解决方案1】：

试试：

jQuery('p').each(function(){     
    if(jQuery(this).text().substr(0,1).toUpperCase() == 'B'){
         jQuery(this).addClass('someclass')
    }
   })

您可以使用 PHP 清理变量并在 JS 中打印它：

<script type="text/javascript">
var letter = '<?php  echo (strlen($_GET['letter']) == 1) ? $_GET['letter'] : ''; ?>'
</script>

或者只是用document.location 抓取它并提取它。

【讨论】：

删除if。三元运算符中不存在 if 关键字。
@BoltClock - 感谢您的指点。我已经删除了 If，它现在正在从字符串中拉出字母。但是该变量似乎没有填充到 jquery 中。
是的，很抱歉我有一个完整的if 声明并抓住了它。 @batfan，如果var letter 定义在全局空间（函数外），它应该可以通过使用if(jQuery(this).text().substr(0,1).toUpperCase() == letter){ 被函数访问。
不过，你最好还是用 JS 来抓。
这个页面是实时发生的吗？一种替代方法是在上面的代码中添加一个}else{ jQuery(this).hide();} 并立即完成所有操作。它可能会消除任何冲突。

【解决方案2】：

如果您想使用 JavaScript 从 URL 查询字符串中获取 letter，请在 window.location.search 上运行正则表达式：

var letterParam = window.location.search.match(/letter=([a-z])/i), letter;

if (letterParam)
{
    letter = letterParam[1];
}

要匹配以该字母开头的段落，请在 JavaScript 字符串中使用 charAt() 方法：

if (letter)
{
    $('p').each(function()
    {
        if ($(this).text().charAt(0).toUpperCase() == 'B')
        {
            // Apply the CSS class or change the style...
        }
    });
}

【讨论】：

【解决方案3】：

隐藏文本不以字母B开头的<p>标签：

$('p').filter(function() {
  return $(this).text().charAt(0).toUpperCase() != 'B';
}).hide();

【讨论】：

【解决方案4】：

$('p').hide().filter(function(){return $(this).text().match(/^b/i);}).show();

或缩进

$('p').hide()
      .filter(
              function(){
                         return $(this).text().match(/^b/i);
                        }
             )
      .show();

如果您希望它区分大小写，请删除匹配中的 i..

你可以看看http://jquery-howto.blogspot.com/2009/09/get-url-parameters-values-with-jquery.html如何获取url参数..

【讨论】：

如果你想让匹配中的 i 区分大小写 in...？

【解决方案5】：

我不知道它在这里是否相关，但我正在使用它来设置第一个字符的样式。

$(".menu ul li.page_item a").each(function() {
var text = $(this).html();
var first = $('<span>'+text.charAt(0)+'</span>').addClass('caps');
$(this).html(text.substring(1)).prepend(first);
});

干杯！

【讨论】：

嘿，我刚刚用两个字符完成了这个工作，所以 substr() 而不是 charAt()，但这正是我所需要的。
干杯伙伴 - 很高兴它有帮助！