我正在寻找一种方法,我可以搜索整个HTML文档中的特定单词,然后将该单词的每个实例与图像交换。
我遇到的问题是我不知道那里有什么内容,因为它是一个动态页面,其中的内容在其他地方被编辑,而网站只是将其拉入,因此很难引用类和ID。
我创建了一个简单的示例,文本可能类似于内容,但我遇到的问题是我的脚本将替换整个文档(我相信因为.html?)而我只是想让它替换那段特定的文本。
<p>hi</p>
<p>j</p>
var x = $('body:contains("hi")');
x.html('<img src="/Content/by_car.jpg" />');
有人能指出我正确的方向吗?
提前致谢
答案 0 :(得分:1)
您需要替换原来的html,如x.html(x.html().replace('hi', '<img src="/Content/by_car.jpg" />'));
此外,如果您有<p class="hiblo">hi</p>
,这将是不好的。在此canse中,它会替换hi
中的hiblo
和hi
内的p
标记,从而破坏您的标记。
通常你可以使用某种正则表达式,但仍然不建议用正则表达式解析html。
答案 1 :(得分:0)
这是工作代码。
此代码还确保脚本和样式标记不会被替换,否则页面逻辑将被破坏。所以它也得到了照顾。
<html>
<head>
<script type="text/javascript" src="jquery-1.11.3.min.js" > </script>
<style></style>
</head>
<body>
<h1>hi</h1>
<div>hi</div>
<input type="button" onclick="return replaceWithImage()" value="replace with image"/>
<script type="text/javascript">
function replaceWithImage() {
var x = $('body').find(':contains("hi")');
x.each(function(){
if($(this).prop('tagName') != 'SCRIPT' && $(this).prop('tagName') != 'STYLE')
$(this).replaceWith('<img src="/Content/by_car.jpg" />');
});
return false;
}
</script>
</body>
</html>