Javascript - 如何替换一个简单的字符串
Javascript - How to replace a simple string
我已经尝试了所有变体来替换字符串,"sub events" 为“selected。我还没有触及 "sub events" 但影响了它周围的一切。
这隐藏了后面的所有内容:
<script type="text/javascript">
$(function(){
$("div[class$=registrationDetails] > ul > li").text(function(){
var str = $(this).text("and the sub events").str.replace("sub events", "selected");
});
});
</script>
我尝试了 W3 School 方法,我也在另一个 Whosebug post 上找到了它,但它什么也没做。这是我用这种方法尝试过的最基本的形式。
<script type="text/javascript">
var str1 = "and the sub events";
var str2 = str1.replace("sub events", "selected");
</script>
它看起来很接近,但不会像它应该的那样替换。谢谢
首先修改您在回调中返回值的方式,replace
也是如此。这一切都假设 <li />
有您要替换的文本。
$(function(){
$("div[class$=registrationDetails] > ul > li").text(function() {
return this.innerText.replace("sub events", "selected");
});
});
这是一种使用每个循环执行您想要的操作的方法。使用 if 语句查看匹配项是否存在
$(function() {
// select the class with a dot, not attribute selector
$("div.registrationDetails > ul > li").each(
function() {
/// read text
var text = $(this).text()
// check if text is there
if (text.includes('sub events')) {
// if it is replace
var str = text.replace('sub events', 'selected')
//update the element
$(this).text(str)
// another change
} else if (text.includes('selected')) {
var str = text.replace('selected', 'sub events')
$(this).text(str)
}
}
);
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<div class="registrationDetails">
<ul>
<li>foo bar sub events</li>
<li>other selected</li>
</ul>
</div>
还有其他方法可以做到这一点,但这是您尝试执行的基本步骤。
一种更复杂的方法是使用文本和带有替换的 reg exp。
// called by the replace method
// returns the opposite of what was matched
function replacerFnc (match) {
return match==="sub events" ? "selected" : "sub events"
}
// What is called by jQuery's text method
function replacement(index, text) {
// regular expression with groups to match either one of the strings
var re = /(sub events|selected)/
// use the reg exp and replace the string
return text.replace(re, replacerFnc)
}
// basic jQuery code to select the lis and set the text
$(function() {
$("div.registrationDetails > ul > li").text(replacement);
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<div class="registrationDetails">
<ul>
<li>foo bar sub events</li>
<li>other selected</li>
</ul>
</div>
这东西对我有用。
var str1 = "and the sub events";
str1 = str1.replace("sub events", "selected")
console.log(str1)
输出-
[运行]节点“..\test.js”
和选定的
我找到了替换文本并保持 html 列表格式的脚本。
<script type="text/javascript">
$('div.registrationDetails > ul > li').html(function(i, htm){
return htm.replace(/sub events/, 'selected');
});
</script>
我已经尝试了所有变体来替换字符串,"sub events" 为“selected。我还没有触及 "sub events" 但影响了它周围的一切。
这隐藏了后面的所有内容:
<script type="text/javascript">
$(function(){
$("div[class$=registrationDetails] > ul > li").text(function(){
var str = $(this).text("and the sub events").str.replace("sub events", "selected");
});
});
</script>
我尝试了 W3 School 方法,我也在另一个 Whosebug post 上找到了它,但它什么也没做。这是我用这种方法尝试过的最基本的形式。
<script type="text/javascript">
var str1 = "and the sub events";
var str2 = str1.replace("sub events", "selected");
</script>
它看起来很接近,但不会像它应该的那样替换。谢谢
首先修改您在回调中返回值的方式,replace
也是如此。这一切都假设 <li />
有您要替换的文本。
$(function(){
$("div[class$=registrationDetails] > ul > li").text(function() {
return this.innerText.replace("sub events", "selected");
});
});
这是一种使用每个循环执行您想要的操作的方法。使用 if 语句查看匹配项是否存在
$(function() {
// select the class with a dot, not attribute selector
$("div.registrationDetails > ul > li").each(
function() {
/// read text
var text = $(this).text()
// check if text is there
if (text.includes('sub events')) {
// if it is replace
var str = text.replace('sub events', 'selected')
//update the element
$(this).text(str)
// another change
} else if (text.includes('selected')) {
var str = text.replace('selected', 'sub events')
$(this).text(str)
}
}
);
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<div class="registrationDetails">
<ul>
<li>foo bar sub events</li>
<li>other selected</li>
</ul>
</div>
还有其他方法可以做到这一点,但这是您尝试执行的基本步骤。
一种更复杂的方法是使用文本和带有替换的 reg exp。
// called by the replace method
// returns the opposite of what was matched
function replacerFnc (match) {
return match==="sub events" ? "selected" : "sub events"
}
// What is called by jQuery's text method
function replacement(index, text) {
// regular expression with groups to match either one of the strings
var re = /(sub events|selected)/
// use the reg exp and replace the string
return text.replace(re, replacerFnc)
}
// basic jQuery code to select the lis and set the text
$(function() {
$("div.registrationDetails > ul > li").text(replacement);
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<div class="registrationDetails">
<ul>
<li>foo bar sub events</li>
<li>other selected</li>
</ul>
</div>
这东西对我有用。
var str1 = "and the sub events";
str1 = str1.replace("sub events", "selected")
console.log(str1)
输出-
[运行]节点“..\test.js” 和选定的
我找到了替换文本并保持 html 列表格式的脚本。
<script type="text/javascript">
$('div.registrationDetails > ul > li').html(function(i, htm){
return htm.replace(/sub events/, 'selected');
});
</script>