根据 url 和 jquery 在社交媒体上分享 post 时如何更改元标记图像？

Question

我需要找到一种方法来更改 HTML 页面标记中的元标记内容图像，具体取决于 url 是否与某个词匹配。

我能够更改元标记内容图像以在 Twitter、Facebook、LinkedIn 等上分享文章...但是它始终是相同的图片。

我的客户想要根据要分享的 post 更改图像。我将需要创建具有不同参数的函数来检查 url 是否与某个字符串匹配，它会动态更改元标记中的内容。我怎样才能用 jquery 做到这一点？欢迎或任何其他建议！

    var imgSrc = $('property[og="image:url"]').attr("content");
    var currentUrl = window.location.href ;


    if(currentUrl.toLowerCase().indexOf('certain string in url') >= 0) {

        imgSrc = 'url of image';

    } else {
        imgSrc = "another url"
    };

Answer 1

根据您现有的代码，您正在设置变量 imgSrc 的值。
要更新元标记，您需要重置其 content 属性。

我建议保存对该元素的引用，这样您就不需要再次select它了：

var $metaOgImage = $('property[og="image:url"]');
var currentUrl = window.location.href;

if (currentUrl.toLowerCase().indexOf('certain string in url') >= 0) {
  $metaOgImage.attr('content', 'url of image');
} else {
  $metaOgImage.attr('content', 'another url');
};

根据 url 和 jquery 在社交媒体上分享 post 时如何更改元标记图像？

How to change the meta tag images when sharing a post in social media depending on the url with jquery?

jquery

share

meta