JavaScript或jQuery的

更改Chrome标签颜色在Chrome中，你可以设置标签的颜色与元标签JavaScript或jQuery的

<meta name="theme-color" content="#FFA000">

在我的网站我有几个部分颜色编码。为了使它看起来更好，我想根据当前打开的部分动态更改标签的颜色。我曾试着用jQuery来做：

$("meta[name='theme-color']").attr('content', '#455A64');

但它不起作用。如果有人能够告诉我是否/如何在运行时改变这个元值，我会非常高兴。

编辑：一些检查，我发现后，该代码确实改变了meta标签的内容，但浏览器不更新的标签颜色。

来源

2015-08-28 Sir_baaron

哇，以前没有听说过'主题color'（和我花了一秒钟，实现你在说关于* Android * Chrome）。 – Jeroen

我已经在本地进行了测试，但是您发布的代码正如您期望的那样工作。您需要添加更多详细信息，以便我们可以重现您的问题。 – Jeroen

正如我试着用我的答案突出显示的，发布的代码应该可以工作。鉴于你的编辑，你仍然无法得到效果。你能否检查你的设备，如果我的答案中的plnkr链接适合你？如果确实如此，那么可能会导致问题的某些特定于您的代码/应用程序的内容。如果没有，你可能需要包括你的设备的详细信息和Chrome/Android的版本，我会再怀疑是罪魁祸首。 – Jeroen

jQuery代码是正确的。如果你想忽悠的标题栏和推动你的用户了，试试这个：

<!DOCTYPE html> 
<html> 
<head> 
    <title>Unicorns!</title> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0"> 
    <meta name="theme-color" content="#FF0000">  
</head> 
<body> 
    <h1>Unicorns are <b id="x">#FF0000</b></h1> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
    <script> 
     $(function() { 
      var i = 0; 
      var colors = ["#FF0000", "#FFFF00", "#00FF00", "#00FFFF", "#0000FF"]; 
      setInterval(function() { 
       var color = colors[i = i++ > 4 ? 0 : i]; 
       $("meta[name='theme-color']").attr('content', color); 
       $("#x").text(color); 
      }, 500); 
     }); 
    </script> 
</body> 
</html>

我已经在我的Nexus 5的Chrome 40.0.2214.89和Android 5.1.1版本进行了测试，看到它的工作。目前还不能确定，虽然该怎么想这种类型的功能的...：P

并非所有的小提琴工具将允许您虽然显示效果，因为我觉得使用iframe可能会阻止您正确地复制它。我发现Plnkr确实工作。访问this demo Plnkr显示对上述设备的影响。

来源

2015-08-28 11:37:29 Jeroen

好吧，事实证明，它并没有在Chrome版本44.x我降级到39版本工作，现在的作品完美！ –

事实证明，它不与Android的Chrome版本43.x & 44.x.工作在其他版本中，上述所有代码均可用。在45.x版本中，它甚至从一种颜色变为另一种颜色，使它看起来非常酷！

来源

2015-09-05 20:10:28

对于这个谁从谷歌这个页面上降落寻找香草JS的解决方案：

document.querySelector('meta[name="theme-color"]').setAttribute('content', '#123456');

来源

2018-02-13 20:15:45 WyriHaximus

JavaScript或jQuery的

回答

相关问题