用当前网址和标题替换[URL]和[TITLE]

时间:2015-10-08 13:51:52

标签: javascript php html svg

我的每个页面顶部都有我的mata标签:

<meta property="url" content="http://stackoverflow.com" />
<meta property="title" content="MY PAGE" />

我有多个社交媒体svgs我想链接到当前的网址和标题。我有正确的查询,但我想动态添加网址和标题。所以Facebook看起来像:

<a href="http://www.facebook.com/sharer/sharer.php?u=[URL]&title=[TITLE]"><img src="images/logo/facebook.svg"></a>

我认为这可以通过Javascript / PHP完成,但最好的方法是什么?

1 个答案:

答案 0 :(得分:3)

你是对的,这可以用PHP或JavaScript完成。

PHP方法

在PHP中执行此操作的一种方法是为每个页面创建$ title和$ url变量:

<head>
<?php
    $metaUrl = "http://stackoverflow.com";
    $metaTitle = "MY PAGE";
?>

并在元标记和锚点中引用它们(请注意,我使用快速回声表示法来回显PHP变量,这对于必须使用完整表示法的旧PHP版本不起作用):

<meta property="url" content="<?=$metaUrl?>" />
<meta property="title" content="<?=$metaTitle?>" />
</head>

<body>
    <a href="http://www.facebook.com/sharer/sharer.php?u=<?=$metaUrl?>&title=<?=$metaTitle?>">
        <img src="images/logo/facebook.svg">
    </a>
</body>

JavaScript方法

通过JavaScript也有一种简单的方法。首先给你的锚一个ID,这样我们就可以在DOM中轻松找到它:

<a id="fb-sharer" href="http://www.facebook.com/sharer/sharer.php?u=[URL]&title=[TITLE]"><img src="images/logo/facebook.svg"></a>

现在在您的脚本中,通过DOM文档对象获取标题和URL:

var title = document.title;
var url = document.URL;

在DOM中找到你的锚并用变量设置href值:

var anchor = document.getElementById("fb-sharer");
var link = "http://www.facebook.com/sharer/sharer.php?u=" + url 
           + "&title=" + title;
anchor.setAttribute("href", link);

您也可以使用JavaScript一次性编写整个元素,将其扔到锚点应该是:

<script>
    var title = document.title;
    var url = document.URL;
    document.write('<a id="fb-sharer"'
                  + 'href="http://www.facebook.com/sharer/sharer.php?u="' + url 
                  + '&title=' + title 
                  + '><img src="images/logo/facebook.svg"></a>');
</script>