使用 Jquery 在 <td> 中获取 CSS 生成的文本

Get CSS generated text inside a <td> with Jquery

本文关键字:CSS 文本 获取 Jquery td 使用      更新时间:2023-09-26

>我有这样的表格:

<table id="orders">
  <tr>
    <td>05/06/2005</td>
    <td>3216549</td>
    <td>description</td>
    <td>2.000,00</td>
    <td>100</td>
    <td>20,00</td>
    <td><div id="state" class="state-c"> </div></td>
    <td><a href="modify.php?id=222"><span class="bt-edit">EDIT</span></a></td>
  </tr>
<table>

<div id="state" class="state-c"> </div>部分告诉"已批准"、"已拒绝"等,由 CSS 生成:

.state-c:before {
  content: "Confirmed";
}

现在我需要获取这些表格单元格的文本值,而对于我成功使用.text()方法的所有单元格,它不会获得 CSS 生成的文本"已确认"。我尝试使用getGeneratedStyle.value,并且一直在搜索数小时的信息,但没有运气。

我的问题是:如果您查看代码,如何在<div id="state" class="state-c"> </div>内获取生成的文本,该文本实际上是空的?

您可以使用

以下方法获得它 window.getComputedStyle .

var text = window.getComputedStyle($('#state')[0], ':before').content
alert(text)
.state-c:before {
  content: "Confirmed";
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="orders">
  <tr>
    <td>05/06/2005</td>
    <td>3216549</td>
    <td>description</td>
    <td>2.000,00</td>
    <td>100</td>
    <td>20,00</td>
    <td><div id="state" class="state-c"> </div></td>
    <td><a href="modify.php?id=222"><span class="bt-edit">EDIT</span></a></td>
  </tr>
<table>

var s = '.state-c:before { content: "Confirmed";}';
var m = s.match(/"(.*?)"/);
alert(m[1]); // m[1] = quoted

只需将 CSS 作为字符串传递并获取双引号内的文本即可。 希望这对您有所帮助

也许你可以试试.find("#state").text("my text")