javascript - 将 [URL] 和 [TITLE] 替换为当前 url 和标题

标签 javascript php html svg

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

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

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

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

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

最佳答案

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

PHP方法

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

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

并在元标记和 anchor 中引用它们(请注意,我使用快速回显表示法来回显 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 来完成此操作。首先为您的 anchor 提供一个 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 中找到您的 anchor 并使用变量设置 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 一次性编写整个元素,将其扔到您的 anchor 应该在的位置:

<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>

关于javascript - 将 [URL] 和 [TITLE] 替换为当前 url 和标题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33017804/

相关文章:

javascript - 将 json 转换为数组/映射

javascript - AJAX 没有设置 PHP $_POST 变量,所以它返回 'Undefined'

javascript - News Ticker - 使用下一个和上一个按钮自动更改 div

php - 正在迁移已弃用的应用程序(mysql_* 到 mysqli): Object of class mysqli could not be converted to string

javascript - 使用 Node.js 和 express-handlebars 从 JSON 文件渲染 html

javascript - 点击缩放时的markerClusterer

javascript - 在 Metro 应用程序中获取窗口尺寸

javascript - 在帧中设置 location.hash

php - 在 Elasticsearch 中进行过滤?

php - 使用 PHP 将时间戳转换为小时