用 jQuery 替换标签的某些部分

Question

我遇到以下问题：我在我的网站上使用视频并想在灯箱中打开它。我的 CMS 不允许我只打开灯箱中的一个视频，但我认为这个问题的技术背景太多了，所以现在我想做的是：

我想用 jQuery 查看我的 link 中的视频，比如 '.mp4">' 这部分我想用这样的东西替换或扩展：'.mp4" data-lightbox="video">'.

我尝试的第一个 thin 是 .replaceWith，但我认为它只适用于类或 ids？也许代码有误？

$('.mp4">').replaceWith('.mp4" data-lightbox="video">');

我使用了不同的搜索方法，但我认为大多数是针对文本更改或 ID 更改和类...

我正在寻找的是可以处理 HTML 的东西，因此它只需替换或添加必要的代码。

此致，马库斯

编辑：HTML：

    <a title="title" href="/files/videos/abc/abc.mp4">
<img alt="title" src="assets/images/f/abc.png">
</a>

Answer 1

而不是将 html 作为文本来操作，我可能会使用 jQuery

来操作属性

这将 select 任何以 .mp4 结尾的 href，如果不是 href，您可以将 href 更改为任何属性名称

jQuery 选择器

$("[href$='.mp4']").attr("data-lightbox", "video")

您可以像这样使用数据：

$("[href$='.mp4']").data("lightbox", "video")

但这不会改变 html 并且只能使用数据 ("lightbox") 读取。话虽如此，如果要为灯箱插件注册锚点，则第二种方法可能会起作用，而且我会说它更干净一些。

Answer 2

尝试使用此代码

 jQuery('.mp4').attr('data-lightbox','video')

Answer 3

试试这个，没有测试过！

var content = $(body); // get content outer

var str = '.mp4" data-lightbox="video">'; // replacement string

var contentInside = content.innerHTML; // now get inner content

var newContent = contentInside.replace(/.mp4">/g, str); // replace ALL occurrences

$(body).html(newContent); // repopulate the outer

希望这样可以解决问题 - 混合 vanilla 和 jquery 除了加快速度之外没有其他原因 - 不确定替换中的 > 是否需要转义并且无法测试现在

用 jQuery 替换标签的某些部分

Replace some parts of a tag with jQuery

jquery

replace

add