JavaScript来更改元/元标记动态

问题描述：

我将描述什么，我试图完成，如果它看来，我的方法是哑巴请随时让我知道：JavaScript来更改元/元标记动态

我有一个网页一个视频库和一个Flash视频播放器iframe。当用户点击视频缩略图时，它开始在框架中播放。

用户还可以通过将文件路径附加到URL的末尾 - blabla.com/videogallery?videofilepath，并将特定的视频加载到iframe中去页面。我设置了这一点，以便视频可以轻松共享。

我希望能够为Facebook/Twitter添加分享按钮，但我无法让他们正常工作并使用正确的元数据（图像和标题）呈现自己。

所以我在考虑在播放器iframe中放置Share按钮，然后在发生视频更改时动态更新元数据标签，但我不确定如何去解决这个问题。

任何帮助将不胜感激，谢谢。

答

你想的jQuery

做的代码是这样的

$(document).ready(function(){ 
    $('title').text("Your new title tag here"); 
    $('meta[name=description]').attr('content', 'new Meta Description here'); 
});

可以搜索引擎获得新的值吗？我尝试使用在线seo工具（http://www.seocentro.com），它没有得到由js设置的值。 – bwaaaaaa 2014-09-02 03:49:33

没关系得到答案 - 蜘蛛无法读取它们，因此元数据应该在服务器端生成。 – bwaaaaaa 2014-09-02 04:44:56

答

你可以在头标记使用这个（jQuery的）添加任何东西

$('head').append('<meta .... />');

简单而有效！我一直在寻找一种解决方案来为Meteor Iron Router支持的应用程序添加标题，并找到各种复杂的解决方案。这像一个魅力。 – 2015-05-09 14:05:47

答

由于上述两种解决方案使用JQuery，这里是一个解决方案纯javascript，incase如果有人正在寻找：

要更改标题：

<script>document.title = "this is title text";</script>

改变任何元标记：

<meta name="description" content="this is old content which we are going to change through javascript">

JavaScript代码来改变上述元标记。

<script> 
var allMetaElements = document.getElementsByTagName('meta'); 
//loop through and find the element you want 
for (var i=0; i<allMetaElements.length; i++) { 
    if (allMetaElements[i].getAttribute("name") == "Description") { 
    //make necessary changes 
    allMetaElements[i].setAttribute('content', "description you want to include"); 
    //no need to continue loop after making changes. 
    break; 
    } 
}

好运。

JavaScript来更改元/元标记动态

相关推荐