试图在剃刀视图中替换可能出现在数据库项的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,只需替换与选择器匹配的元素的所需文本。
请注意,我已经为一个文本元素和所需的类添加了一些文本元素,并使用justified来替换justify以演示其用法。
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"));