我正在尝试基于HTML td元素的文本添加“ title”属性。
我写了以下内容:
$("tr.sel-rtac-first td:first-child").each(function(t,x){
var hours = "";
var text = $(x).text();
switch (text) {
case (text.includes("מרכזית-מדף פתוח") == true):
hours = "יהדות 401: א - ה 08:00 - 19:00"
break;
default: hours = "text"
}
$(x).attr("title",hours);
});
我在测试中可以看到text变量接收到正确的文本:
"
Cen.lib-Stacks - מרכזית-מדף פתוח -#Four weeks - ארבעה שבועות#
"
该文本为希伯来语,但您可以清楚地看到我正在寻找的文本确实是可变文本的一部分。 但是,它恢复为默认值,无法识别文本包含该句段。
我也尝试了在代码中不使用== ture:
case (text.includes("מרכזית-מדף פתוח")):
但这也不起作用。
我测试过的以前的解决方案是使用.title()函数,但这也不起作用(我怀疑是因为该元素没有开头的title属性,所以我要添加一个)。
如何确保include函数能够识别出该子字符串确实在文本中?
答案 0 :(得分:1)
不好用“ switch”和“ case”。
您可以编写:
$("tr.sel-rtac-first td:first-child").each(function(t,x){
var hours = "";
var text = $(x).text();
if (text && text.includes("מרכזית-מדף פתוח")) {
hours = "יהדות 401: א - ה 08:00 - 19:00";
} else {
hours = "text";
}
$(x).attr("title",hours);
});
答案 1 :(得分:1)
使用if
语句代替@ mark.hch建议的切换大小写。
关于越野车,您提供的代码无法重现该问题:
const haystack = 'Cen.lib-Stacks - מרכזית-מדף פתוח -#Four weeks - ארבעה שבועות#';
const needle = 'מרכזית-מדף פתוח';
console.log(haystack.includes(needle));
您正在观察的错误很可能是其他地方引起的。
答案 2 :(得分:1)
处理此类搜索的最佳方法是带有unicode标志的RegExp:u
:
// RegEx literal syntax for unicode ex. a => U+61 => \u{61} /\u{5DE}\u{5E8}\u{5DB}\u{5D6}\u{5D9}\u{5EA}\x2D\u{5DE}\u{5D3}\u{5E3} \u{5E4}\u{5EA}\u{5D5}\u{5D7}/u
当我尝试突出显示某些字母时,堆栈编辑器将跳过它们。为了避免源自不同语言的任何不兼容性,unicode是一种可能的解决方案。使用ES2015 Unicode regular expression transpiler可以翻译。
除了上述建议外,还需要解决jQuery逻辑:
使用.each()
方法并引用当前元素时,请使用$(this)
var text = $(this).text()
诸如.includes()
和.test()
(演示中的Regexp方法)之类的方法返回true
或false
。处于条件中时,较不复杂的语法为:
if (RegExp.test("String")) {...
使用== true
会产生相同的结果,但是在其他情况下,它可能会更改类型,因此请小心。
$("tr td:first-child").each(function(){
var text = $(this).text();
if (/\u{5DE}\u{5E8}\u{5DB}\u{5D6}\u{5D9}\u{5EA}\x2D\u{5DE}\u{5D3}\u{5E3} \u{5E4}\u{5EA}\u{5D5}\u{5D7}/u.test(text)) {
$(this).attr("title", "יהדות 401: א - ה 08:00 - 19:00");
} else {
$(this).attr('title', text);
}
});
table {
table-layout: fixed;
width: 80vw;
height: 80vh;
margin: 5vh auto
}
td {
width: 33%;
}
table, td {
border: 1px solid #000
}
td::before {
content: ' ';
min-height:20px;
}
<table>
<tr><td>Cen.lib-Stacks - מרכזית-מדף פתוח -#Four weeks -
ארבעה שבועות#</td><td></td><td></td></tr>
<tr><td>TEST</td><td></td><td></td></tr>
<tr><td>TEST</td><td></td><td></td></tr>
<tr><td>TEST</td><td></td><td></td></tr>
<tr><td>Cen.lib-Stacks - מרכזית-מדף פתוח -#Four weeks -
ארבעה שבועות#</td><td></td><td></td></tr>
<tr><td>TEST</td><td></td><td></td></tr>
<tr><td>TEST</td><td></td><td></td></tr>
<tr><td>TEST</td><td></td><td></td></tr>
<tr><td>Cen.lib-Stacks - מרכזית-מדף פתוח -#Four weeks -
ארבעה שבועות#</td><td></td><td></td></tr>
<tr><td>TEST</td><td></td><td></td></tr>
</table>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>