Javascript-可以将两个小书签和一个Greasemonkey脚本组合成一个小书签吗？如果是这样,怎么办？
作者：互联网
如果这个问题完全不合适,请原谅我.我对编程一无所知.我知道我应该学习Javascript,但是对于一个外行来说这有点困难.
我有两个书签和一个用户脚本,它们一起可以满足我的需求.但我需要单击,等待,然后单击.可以将它们全部合并为一个书签吗？这适用于Windows XP上的Firefox 5.
第一个小书签会获取页面上指向图像的所有链接,并将所有这些图像显示在新标签的单个页面中：
javascript:(function(){function%20I(u){var%20t=u.split('.'),e=t[t.length-1].toLowerCase();return%20{gif:1,jpg:1,jpeg:1,png:1,mng:1}[e]}function%20hE(s){return%20s.replace(/&/g,'&').replace(/>/g,'>').replace(/</g,'<').replace(/"/g,'"');}var%20q,h,i,z=open().document;z.write('<p>Images%20linked%20to%20by%20'+hE(location.href)+':</p><hr>');for(i=0;q=document.links[i];++i){h=q.href;if(h&&I(h))z.write('<p>'+q.innerHTML+'%20('+hE(h)+')<br><img%20src="'+hE(h)+'">');}z.close();})()
然后启动用户脚本,该脚本将页面标题更改为包括[已加载页面]：
// ==UserScript==
// @name Add "loaded" to title if page is loaded
// @namespace my
// @description Indicate if a page is loaded
// @include *
// ==/UserScript==
window.addEventListener(
'load',
function (e) {
document.title += " - [Page loaded]";
},
false);
最后,我单击第二个书签,该书签将删除页面中所有小于特定大小的文本和图像,并将其设为黑色背景.希望此部分仅在所有图像都加载后才起作用(因此,从用户脚本中获得“已加载”标题).
我必须将其放入内联代码中,因为其他方法似乎失败了(代码按钮和blockquote都没有做任何事情).如果有人可以帮助我,那就太好了！我自己不能写一行Javascript,也不知道该怎么办.
function wrap(image, href) {
var img = document.createElement('img');
var div = document.createElement('div');
img.src = image.src;
var node = image.parentNode;
if (!href) {
div.appendChild(img);
} else {
var a = document.createElement('a');
a.href = href;
a.appendChild(img);
div.appendChild(a);
}
return div;
}
function findNext(document) {
var res = document.evaluate('//a[@rel='
next ']', document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null);
if (res.singleNodeValue) {
return res.singleNodeValue.href;
} else {
return null;
}
}
if ('scrollMaxY' in window) {
function getScrollMaxY() {
return window.scrollMaxY;
}
} else {
function getScrollMaxY() {
return document.body.scrollHeight - window.innerHeight;
}
}
function streamify() {
var contentDiv = document.createElement('div');
var imageDiv = document.createElement('div');
var moreButton = document.createElement('input');
var style = document.createElement('style');
var iframe = document.createElement('iframe');
var errorSpan = document.createElement('span');
var retryButton = document.createElement('input');
var currentPageDiv = document.createElement('div');
var currentPageLink = document.createElement('a');
var nextUrl = findNext(document);
var occured = {};
var images = [];
var loadTimer = null;
var scrolledToBottom = false;
function extract(elem, href, images) {
switch (elem.localName) {
case 'a':
href = elem.href;
break;
case 'img':
if (!(elem.src in occured) && elem.offsetWidth > 250 && elem.offsetHeight > 300) {
images.push(wrap(elem));
occured[elem.src] = true;
}
}
var child = elem.firstElementChild;
while (child) {
extract(child, href, images);
child = child.nextElementSibling;
}
}
function loadNext() {
if (loadTimer !== null) {
window.clearTimeout(loadTimer);
}
if (nextUrl) {
loadTimer = window.setTimeout(function () {
errorSpan.style.display = '';
loadTimer = null;
}, 30000);
iframe.src = nextUrl;
}
}
style.type = 'text/css';
style.appendChild(document.createTextNode('body {background-color: black;color: white;}a {color: white;font-weight: bold;text-decoration: none;}a:hover {text-decoration: underline;}#greasemonkey-image-stream-content {text-align: center;}#greasemonkey-image-stream-content > div > div {margin-top: 2em;margin-bottom: 2em;}#greasemonkey-image-stream-content input {padding: 0.5em;font-weight: bold;}'));
contentDiv.id = 'greasemonkey-image-stream-content';
currentPageLink.appendChild(document.createTextNode('current page'));
currentPageLink.href = window.location.href;
currentPageDiv.appendChild(currentPageLink);
moreButton.type = 'button';
moreButton.value = 'More';
moreButton.disabled = true;
function handleMore() {
currentPageLink.href = iframe.src;
scrolledToBottom = false;
errorSpan.style.display = 'none';
moreButton.disabled = true;
for (var i = 0; i < images.length; ++i) {
imageDiv.appendChild(images[i]);
}
images = [];
loadNext();
}
moreButton.addEventListener('click', handleMore, false);
retryButton.type = 'button';
retryButton.value = 'Retry';
retryButton.addEventListener('click', function (event) {
loadNext();
errorSpan.style.display = 'none';
}, false);
errorSpan.style.fontWeight = 'bold';
errorSpan.style.color = 'red';
errorSpan.style.display = 'none';
errorSpan.appendChild(document.createTextNode(' Load Error '));
errorSpan.appendChild(retryButton);
iframe.style.width = '0px';
iframe.style.height = '0px';
iframe.style.visibility = 'hidden';
iframe.addEventListener('load', function (event) {
if (loadTimer !== null) {
window.clearTimeout(loadTimer);
}
errorSpan.style.display = 'none';
nextUrl = findNext(iframe.contentDocument);
extract(iframe.contentDocument.body, null, images);
if (images.length == 0 && nextUrl) {
loadNext();
moreButton.disabled = true;
} else {
moreButton.disabled = !nextUrl && images.length == 0;
if (scrolledToBottom && (nextUrl || images.length > 0)) {
handleMore();
}
}
}, false);
extract(document.body, null, images);
for (var i = 0; i < images.length; ++i) {
imageDiv.appendChild(images[i]);
}
images = [];
contentDiv.appendChild(style);
contentDiv.appendChild(currentPageDiv);
contentDiv.appendChild(imageDiv);
contentDiv.appendChild(moreButton);
contentDiv.appendChild(errorSpan);
contentDiv.appendChild(iframe);
var elem = document.documentElement.firstElementChild;
while (elem) {
switch (elem.localName) {
case 'head':
var child = elem.firstElementChild;
while (child) {
var next = child.nextElementSibling;
if (child.localName != 'title') {
elem.removeChild(child);
}
child = next;
}
break;
case 'body':
while (elem.firstChild) {
elem.removeChild(elem.firstChild);
}
}
elem = elem.nextElementSibling;
}
window.addEventListener('scroll', function (event) {
if (window.scrollY >= getScrollMaxY()) {
scrolledToBottom = true;
moreButton.click();
}
}, false);
document.body.appendChild(contentDiv);
loadNext();
}
streamify();
void(0)
解决方法:
(function(){
var a=Array.filter(document.getElementsByTagName('a'),function(e){
var h=e.href.split('.').pop().toLowerCase();
return {gif:1,jpg:1,jpeg:1,png:1,mng:1}[h];
}),b=document.getElementsByTagName('body')[0],i=0,l=a.length;
b.innerHTML='';
b.style.background='#000';
b.style.color='#ddd'
for(i;i<l;i++){
var t=a[i].href,p=document.createElement('img'),s=document.createElement('div');
s.innerHTML=t;
p.src=t;
b.appendChild(p);
b.appendChild(s);
}
})()
在这里它被压缩
javascript:(function(){var c=Array.filter(document.getElementsByTagName("a"),function(a){return{gif:1,jpg:1,jpeg:1,png:1,mng:1}[a.href.split(".").pop().toLowerCase()]}),a=document.getElementsByTagName("body")[0],b=0,g=c.length;a.innerHTML="";a.style.background="#000";a.style.color="#ddd";for(b;b<g;b++){var d=c[b].href,e=document.createElement("img"),f=document.createElement("div");f.innerHTML=d;e.src=d;a.appendChild(e);a.appendChild(f)}})();
等待每个图像加载的图像.添加了错误检测.
(function(){
var a=Array.filter(document.getElementsByTagName('a'),function(e){
return {gif:1,jpg:1,jpeg:1,png:1,mng:1}[e.href.split('.').pop().toLowerCase()];
}),b=document.getElementsByTagName('body')[0],i=0,l=a.length;
b.innerHTML='';
b.style.background='#000';
b.style.color='#ddd'
add(0);
function add(i){
var img=new Image(),t=a[i].href,p=document.createElement('img'),s=document.createElement('div');
img.src=t;
img.onload=function(){
s.innerHTML=t;
p.src=t;
b.appendChild(p);
b.appendChild(s);
++i<a.length?add(i):'';
};
img.onerror=function(){
++i<a.length?add(i):'';
};
}
})()
和缩小版.
javascript:(function(){function d(b){var e=new Image,c=f[b].href,g=document.createElement("img"),h=document.createElement("div");e.src=c;e.onerror=function(){++b<f.length&&d(b)};e.onload=function(){h.innerHTML=c;g.src=c;a.appendChild(g);a.appendChild(h);++b<f.length&&d(b)}}var f=Array.filter(document.getElementsByTagName("a"),function(a){return{gif:1,jpg:1,jpeg:1,png:1,mng:1}[a.href.split(".").pop().toLowerCase()]}),a=document.getElementsByTagName("body")[0];a.innerHTML="";a.style.background="#000";a.style.color="#ddd";d(0)})();
这是一些测试HTML
<a href='http://mozcom-cdn.mozilla.net/img/covehead/about/logo/download/logo-only-preview.png'>Firefox</a>
<a href='http://ie.microsoft.com/testdrive/Graphics/IEBeatz/assets/ie-logo-small.png'>IE</a>
<a href='http://code.google.com/tv/images/chrome-logo.png'>Chrome</a>
我没有在图像尺寸上添加限制器,因为我不确定是否有必要,并且不确定您想要什么尺寸限制.
标签：bookmarklet,firefox,greasemonkey,javascript 来源： https://codeday.me/bug/20191102/1990971.html