javascript 为图像添加边框

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/5161556/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-25 16:12:10  来源:igfitidea点击:

Add border to images

javascriptimagebookmarklet

提问by Michael

I'm totally new to JS. I'm trying to make me a bookmarklet that finds all images on a web page and adds a colorful border to them. Then, by clicking on an image I'd like to attach the image path. This is what I've got so far:

我对 JS 完全陌生。我正在尝试制作一个书签,它可以找到网页上的所有图像并为它们添加彩色边框。然后,通过单击图像,我想附上图像路径。这是我到目前为止所得到的:

javascript:
for (var i= document.links.length; i-->0;) {
    if (document.links[i].getElementsByTagName('img').length!=0) {
        document.links[i].onclick= function() {
           window.open("http://www.example.com/whatever?imgsrc=" + this.src + "");
        };
    }
}

How can I add a border to the images?

如何为图像添加边框?

Thanks, Bob

谢谢,鲍勃

回答by ahgood

Try this code:

试试这个代码:

javascript:for(i=0;i<document.getElementsByTagName('img').length;i++){var imgTag=document.getElementsByTagName('img')[i];imgTag.style.border='2px solid #E8272C';imgTag.onclick=function(){return !window.open(this.src)};}void(0)

Friendly formatted view:

友好的格式化视图:

javascript:
for(i=0;i<document.getElementsByTagName('img').length;i++){
    var imgTag=document.getElementsByTagName('img')[i];
    imgTag.style.border='2px solid #E8272C';
    imgTag.onclick=function(){
        return !window.open(this.src);
    }
}void(0)

回答by Free Consulting

There is no need to call getElementsByTagName

无需调用 getElementsByTagName

javascript:(function(){for(var i=0;i<document.images.length;i++){var image=document.images[i];image.style.border='medium solid blue';image.onclick=function(){location.href=this.src;return false;};}})()