jquery将字符串替换为超链接

导读:本篇文章讲解 jquery将字符串替换为超链接,希望对大家有帮助,欢迎收藏,转发!站点地址:www.bmabk.com

假如html页面的字符串是个网址链接,你想把这个字符串替换为超链接可以参考本文使用jquery来实现。

效果如下:

在这里插入图片描述
点击后:
在这里插入图片描述

示例代码如下:

<!DOCTYPE html>
<html>
<head>
<style> 
.wffitempp{
	border: 1px solid #000;
	width:420px;
}

.buttonset{
	margin-top: 20px;
    color: #FFFFFF;
    background-color: #276FF5;
}
</style>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>

<body>
<div class="wffitempp">
	<ul>
		<li class="ng-scope">
			<span class="ng-binding td">
				87106
			</span>	
		</li>
	
		<li class="ng-scope">
			<span class="ng-binding td">
				付款通知单(经常性审批)
			</span>	
		</li>
	
		<li class="ng-scope">
			<span class="ng-binding td">
				2022-12-01
			</span>	
		</li>
	
		<li class="ng-scope">
			<span class="ng-binding td">
				http://www.baidu.com
			</span>	
		</li>
	</ul>
</div>

<div class="wffitempp">
	<ul>
		<li class="ng-scope">
			<span class="ng-binding td">
				87107
			</span>	
		</li>
	
		<li class="ng-scope">
			<span class="ng-binding td">
				付款通知单(不经常性审批)
			</span>	
		</li>
	
		<li class="ng-scope">
			<span class="ng-binding td">
				2022-12-02
			</span>	
		</li>
	
		<li class="ng-scope">
			<span class="ng-binding td">
				https://blog.csdn.net/qq_33697094?type=blog
			</span>	
		</li>
	</ul>
</div>

<button class="buttonset" onClick="set()">点击</button>

</body>

<script>
	function set(){
		$("span.ng-binding,.td").each(function(){
			var val  = $(this)[0].innerText;
			if(val.startsWith("http://")||val.startsWith("https://")){
				$(this)[0].innerHTML = "<a href='"+val+"'>查看</a> "
			}
		})
	}
</script>
</html>

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

文章由极客之家整理,本文链接:https://www.bmabk.com/index.php/post/80211.html

(0)
小半的头像小半

相关推荐

极客之家——专业性很强的中文编程技术网站,欢迎收藏到浏览器,订阅我们!