js获取字符串中超链接，并加样式跳转页面

花笙_

已于 2024-06-26 15:30:35 修改

阅读量211

点赞数 9

分类专栏： VUE 文章标签： javascript 前端

于 2024-06-26 15:29:49 首次发布

本文链接：https://blog.csdn.net/wang_59881/article/details/139990157

版权

VUE 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

效果图
在这里插入图片描述

主要代码：js

this.$nextTick(() => {
	// 给循环出来的div标签加个id为
	let container = document.getElementById("linkTo");
	container.innerHTML = container.textContent.replace(/(https?:\/\/[^\s]+)/g, function (match) {
    	var link = document.createElement("a");
    	link.href = match;
    	link.style.color = "blue"; // 设置链接颜色为蓝色
    	link.target = "_blank";  // 在新窗口打开链接
    	link.style.textDecoration = "underline";  // 下划线
    	link.textContent = match;
    	link.onclick = function () {
     		return false; // 阻止链接默认行为
    	};
   		return link.outerHTML;
	});
});