首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >使用jQuery使用使用包含

使用jQuery使用使用包含
EN

Stack Overflow用户
提问于 2022-08-31 04:26:49
回答 2查看 48关注 0票数 1

我在一张表中有4列和10行左右。我正在尝试让一个onclick事件搜索被单击的行并从该行中删除"T“,但现在它正在搜索并删除表中的所有"T”,而不仅仅是单击的行。我该换什么?

代码语言:javascript
运行
复制
$('#table_output tbody').on('click', 'tr', function() {
    console.log(table.row(this).data());
    $(':contains("T")').each(function(){
        $(this).html($this).html().split("T").join(""));
    });
    alert(JSON.stringify(table.row(this).data()));
})
EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2022-08-31 04:43:17

:contains("T")会找到每个包含'T‘的元素。我用$(this).find(':contains("T")')代替了它,它只搜索被单击的<tr>的子级。

还有一些我修复的字体,还有一些未知的变量,比如table,我已经将其注释掉了。

代码语言:javascript
运行
复制
$('#table_output tbody').on('click', 'tr', function() {
    //console.log(table.row(this).data());
    $(this).find(':contains("T")').each(function(){
        //$(this).html($(this).html().split("T").join(""));
        $(this).html($(this).html().split("T").join(""))
    });
    //alert(JSON.stringify(table.row(this).data()));
})
代码语言:javascript
运行
复制
<script src="https://code.jquery.com/jquery-3.6.1.js" integrity="sha256-3zlB5s2uwoUzrXK3BT7AX3FyvojsraNFxCc2vC/7pNI=" crossorigin="anonymous"></script>

<table id="table_output">
<tbody>
<tr>
    <td>Total</td>
    <td>Tee Time</td>
    <td>Food for Thought</td>
</tr>
<tr>
    <td>Total</td>
    <td>Tee Time</td>
    <td>Food for Thought</td>
</tr>
<tr>
    <td>Total</td>
    <td>Tee Time</td>
    <td>Food for Thought</td>
</tr>
</tbody>
</table>

票数 2
EN

Stack Overflow用户

发布于 2022-08-31 06:06:22

这是另一个关于脚本的看法。我选择只对实际的文本节点(this.nodeType===Node.TEXT_NODE)进行操作。这将可靠地避免在过程中混淆html标记。在我的示例中,我将所有小写"t“替换为空字符串("")。将.replaceAll("t","")直接应用于包含"t“的元素的innerHTML字符串将使第二行的内表结构混乱。通过限制文本节点上的操作,只有所有内容仍然保持不变:

代码语言:javascript
运行
复制
$('#table_output tbody').on('click', 'tr', function() {
  const repl="t";
  $(`:contains(${repl})`,this).contents().each(function(){
    if (this.nodeType===Node.TEXT_NODE && this.textContent.includes(repl))
      this.textContent=this.textContent.replaceAll(repl,"");
  }); 
})
代码语言:javascript
运行
复制
<script src="https://code.jquery.com/jquery-3.6.1.js"></script>

<table id="table_output">
<tbody>
<tr>
    <td>Total</td>
    <td>Tea time</td>
    <td>Food for thought</td>
</tr>
<tr>
    <td>total</td>
    <td>tea time
     <TABLE>
      <tr><TD>attitude</TD><TD>beta</TD></tr>
      <tr><TD>gamma</TD><TD>delta</TD></tr>
     </TABLE>
    </td>
    <td>Food for thought</td>
</tr>
<tr>
    <td>Total</td>
    <td>tea time</td>
    <td>Food for Thought</td>
</tr>
</tbody>
</table>

出于兴趣,我寻找一种无需使用jQuery就能找到元素的文本节点的方法。有这样一种方法:

代码语言:javascript
运行
复制
function getTextNodesIn(elem, opt_fnFilter) {
  var textNodes = [];
  elem && [...elem.childNodes].forEach(n=>{
    if (n.nodeType == 3 && (!opt_fn()Filter || opt_fnFilter(n, elem))) textNodes.push(n);
    else if ([1,9,11].includes(n.nodeType)) textNodes = textNodes.concat(getTextNodesIn(n, opt_fnFilter));
  });
  return textNodes;
}

我从克里斯·韦斯特的博客那里得到了这个--以稍长的形式。

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/73550868

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档