根据Wizek的建议，您可以将代码放入data-uri。
data:text/html;charset=utf-8,
<html>
<link rel="shortcut icon" href="https://stackoverflow.com/favicon.ico">
<script type="text/javascript">
alert('It works!')
</script></html>
并将所有这些保存为书签。（试试吧！将代码拖到选项卡栏中）
不幸的是，它仅在某些情况下有效（更多信息请参见下文）。
这个怎么运作：
（至少在Chrome中）类似于使用javascript: "<html>...your html code here, including a javascript tag that will run when loaded...</html>"其他解决方案建议的格式的书签。在这种情况下，您所在页面上的html 将被书签小册中的html 代替，但是位置保持不变，小书签本身仍然没有位置，因此Chrome无法为其保存收藏夹图标。
相反，使用data-uri书签，我们转到其他页面，它具有其自己的位置，浏览器可以为其保存一个收藏夹图标。将其视为“在浏览器中托管网站”，如果您同步书签，则可以在其他计算机上访问它。如果您想将所有内容都保留在本地，也可以将favicon用作base64图像而不是url。
它有局限性。
当您单击它时，它将离开当前页面并将该页面加载到数据中。因此，您将无法将其用于与当前页面交互的小册子，仅用于可在其他页面中执行的代码。
不要在//中使用注释。由于所有内容都将保存在一行中，因此请将它们包装在/ ** /中，不要忘记分号
在FF中，它保存了收藏夹图标，但是如果我想使用window.open（），则无法将其设置为始终打开弹出窗口，因为它不允许我为数据网址保存默认行为
举个例子：
使用这种技术，我创建了一个带有图标生成器的小书签。您可以将此代码拖到URL栏中（或将其另存为书签）以使用它。这是一个简单的页面，带有用于代码和图标的输入区域，然后生成带有图标的书签
data:text/html;charset=utf-8,<html><head>
<title>Bookmarklet With Icon Generator</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" ></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" >
<link rel="shortcut icon" href="https://www.freefavicon.com/freefavicons/objects/plain-thumbs-up-152-237293.png">
</head>
<body>
<div class="container">
<div class="page-header">
<h2>Write your javascript and specify a favicon, then drag the button to your bookmarks bar</div>
</h2>
<a id="bookmarkbutton" href='' ondragend='this.click()' draggable="true" class="btn btn-primary btn-lg" role="button">
Drag me to your bookmarks bar! </a><br /><br />
<div>
<label for="fav_href">Favicon:</label>
<input id="fav_href" value='https://stackoverflow.com/favicon.ico' style='width:100%'></input> </div><br />
<div>
<label for='ta'>Write your JavaScript below</label>
<textarea id="ta" style="width:100%;height:50%">
setTimeout(()=>{ &%2313
alert('hello world'); /*Use this format for comments, use %2523 instead of hash (number sign)*/ &%2313
window.history.back(); &%2313
},200);
</textarea></div>
</div>
<script type = "text/javascript">
fav_href.onchange = ta.onchange = function(){
bookmarkbutton.href = 'data:text/html;charset=utf-8,<html><head>'+
'<link rel="shortcut icon" href="'+ fav_href.value +'">'+
'<script type="text/javascript"> '+ ta.value +'<\/script>';
};
ta.onchange();
</script>
</body>
另一个示例：通过书签在其自己的小窗口中打开Facebook Messenger（如果您的浏览器默认阻止弹出窗口，则可能无法使用）
data:text/html;charset=utf-8,
<html>
<link rel="shortcut icon" href="https://facebook.com/images/messengerdotcom/favicon/favicon.ico">
<script type="text/javascript">
url = 'https://www.messenger.com/';
w = 740; h = 700;
x = parseInt( screen.availWidth/2 - w/2 );
y = parseInt( screen.availHeight/2 - h/2 );
nw = window.open(url,'', 'width='+ w +',height='+ h +',top='+ y +',left='+ x);
nw.focus();
setTimeout(()=>{
window.history.back();
window.close();
},200);
</script>
获取小书签图标的其他Chrome解决方法：
