[英]How do I replace instances of a word in multiple tags on page load?
试图替换可能会出现在剃刀视图中数据库项目的 foreach 循环中的单词。
到目前为止我尝试过的
<section class="section bg-gray">
<div class="container">
<div class="row gap-y">
@foreach (var item in Model)
{
<div class="col-md-6 col-lg-4">
<div class="card d-block">
<p class="text-justify">@item.Text</p>
<p class="text-center mt-7">
<a class="btn btn-primary" href="#">Read more</a>
</p>
</div>
</div>
}
</div>
<script src="~/Scripts/jquery-3.3.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
var elements = getElementsByClassName("text-justify");
$(elements).each(function(element) {
element.innerHTML = element.innerHTML.replace(/wordToReplace/g, 'newWord');
});
});
</script>
</div>
</section>
原谅我可怜的 JavaScript,我是前端新手。 我寻找了类似的问题,但更接近的主题通常是关于替换一个标签中的单词实例。 请帮忙。
为此,您不需要 jQuery - 您可以使用 document.querySelectorAll 并替换与选择器匹配的元素的所需文本。
请注意,我已经避开了文本元素和所需的类,并将justify替换为justified以演示用法。
let elements = document.querySelectorAll(".text-justify"); elements.forEach(function(element){ let textContent = element.innerText; let newTextContent = textContent.replace(/justify/g, 'justified'); element.innerText = newTextContent; })
<p class="text-justify">This is a text with the class of text-justify</p> <p>This is a text without the class of text-justify</p> <p class="text-justify">This is a text with the class of text-justify</p>
为此,您不需要 jQuery - 使用简单的forEach
循环。 我还重构了您代码的其他一些部分(例如,您丢失了document
:
document.getElementsByClassName("text-justify").forEach(element => element.innerHTML = element.innerHTML.replace(/word/g, "newWord"));
但如果你真的想使用 jQuery:
$(".text-justify").html((index, element) => element.replace(/word/g, "newWord"));
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.