Question

以下是班级名称

<p class="question3.1">Question 3.1</p>
<p class="question3.10">Question 3.10</p>
<p class="question3.11">Question 3.11</p>
<p class="question3.12">Question 3.12</p>

我希望在JQuery中获得文本3.1的价值：

alert($("p[class*='question3.1']").text())

它返回所有问题的文本，即

Question 3.1Question 3.10Question 3.11Question 3.12

但是，如果我使用以下，那么它可以正常工作。

alert($("p[class*='question3.10']").text())

我如何才能选择问题3.1的文字？

我无法重构HTML。

小提琴： https://jsfiddle.net/e9w9fhyw/

Answer 1

那些类名是疯了。

你可以选择它们。你有两个选择：

您转义. in和
以空格分隔的属性选择器（~=）

转义类选择器

第一个的CSS类选择器是

.question3\2e\31

\2e是点，然后因为它发生在点后面的是一个数字，可以将其带入转义序列，我们使用\31作为1。

要在jQuery选择器中编写它，你必须转义反斜杠，所以要获得第一个，你要使用：

$(".question3\\2e\\31").text()

直播示例：

＆＃13;

document.body.insertAdjacentHTML(
  "beforeend",
  "The first one is: " + $(".question3\\2e\\31").text()
);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<p class="question3.1">Question 3.1</p>
<p class="question3.10">Question 3.10</p>
<p class="question3.11">Question 3.11</p>
<p class="question3.12">Question 3.12</p>
<hr>

＆＃13;

以空格分隔的属性选择器

whitespace-separated attribute selector [att~="val"] ...

表示具有att属性的元素，该属性的值是以空格分隔的单词列表，其中一个正是＆＃34; val＆＃34;。如果＆＃34; val＆＃34;包含空格，它永远不会代表任何东西（因为单词用空格分隔）。如果＆＃34; val＆＃34;是空字符串，它永远不会代表任何东西。

所以：

$('[class~="question3.1"]').text()

直播示例：

＆＃13;

document.body.insertAdjacentHTML(
  "beforeend",
  "The first one is: " + $('[class~="question3.1"]').text()
);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<p class="question3.1">Question 3.1</p>
<p class="question3.10">Question 3.10</p>
<p class="question3.11">Question 3.11</p>
<p class="question3.12">Question 3.12</p>
<hr>

＆＃13;

Answer 2

我建议你看一下：Link。所以把它改成这样的东西：

<p class="question" data-question="3.1">Question 3.1</p>
<p class="question" data-question="3.10">Question 3.10</p>
<p class="question" data-question="3.11">Question 3.11</p>
<p class="question" data-question="3.12">Question 3.12</p>

然后你的jQuery将是：

$(document).ready(function(){
    console.log($('.question[data-question="3.10"]').html());
});

以上内容将在您的控制台中打印问题3.10！

JQuery：如何在类名中使用小数来获取文本？

2 个答案:

转义类选择器

以空格分隔的属性选择器