使用JavaScript书签从图像链接中提取alt文本

Extracting alt text from image links with a JavaScript bookmarklet

本文关键字：提取 alt 文本 链接 图像 JavaScript 书签 使用      更新时间：2023-09-26

我找到了一种通过找到的Perl脚本从图像链接中提取alt文本的方法。然而，该方法需要下载目标HTML；通过Perl脚本进行处理，然后生成一个包含我需要的特定alt文本的文本文件；然后删除一些我无法手动通过代码过滤掉的额外文本，因为我不知道如何使regex与Perl一起工作（我尝试安装PCRE，但没有成功）。

这种方法仍然不切实际，我相信我可以更快地通过JavaScript bookmarklet提取alt文本，并立即将输出整齐地列在新的选项卡中。然而，我不知道如何将Perl脚本转换为JavaScript，也不知道如何从头开始编写。

这是Perl脚本：

{
    # Get data from HTML file
    my $From = cwd() . '/' . $ARGV[0];
    open( HTMLFILE, '<' . $From ) or die( "Cannot open $From to read." );
    my $Html;
    read HTMLFILE, $Html, -s $From;
    close HTMLFILE;
    # Find IMG elements
    print "Images found!";
    my %AltTexts;
    while ( $Html =~ /(<IMG'b.*?>)/isg ) {
        my $ImgElement = $1;
        # Find SRC tag
        $ImgElement =~ /SRC's*='s*(['"''])(.*?)'1/is;
        my $Src = $2;
        # Find ALT tag & store text
        if ( $ImgElement =~ /ALT's*='s*(['"''])(.*?)'1/is ) {
            $AltTexts{$Src} = $2;
        }
        else {    # No ALT found so give it default text if none already found
            unless ( exists( $AltTexts{$Src} ) ) {
                $AltTexts{$Src} = 'NO_ALT_TEXT';
            }
        }
    }
    # Write extracted data to a file
    my $To = cwd() . '/' . $ARGV[0] . '.txt';
    open( ALTTEXTFILE, '>' . $To ) or die( "Cannot open $To to write." );
    foreach my $SrcPath ( sort keys %AltTexts ) {
        print ALTTEXTFILE "$AltTexts{$SrcPath}'n";
    }
    close ALTTEXTFILE;
}

我确实对它进行了调整，以阻止脚本打印链接，删除空行等。

原始脚本可以在这里找到

所以，我的问题是，提取alt文本的JavaScript会是什么样子？

像这样：

javascript:(function() {
  var imgs = document.images,alts=[];
  for (var i=0;i<imgs.length;i++) {
      alts.push(imgs[i].getAttribute("alt") || "no alt");
  }
  alert(alts.join("'n"));
})()

示例代码：

(function() {
  var imgs = document.images,alts=[];
  for (var i=0;i<imgs.length;i++) {
    alts.push(imgs[i].getAttribute("alt") || "no alt");
  }
  console.log(alts);
})()
<img alt="alt1" />
<img alt="" />
<img alt="alt2" />

在新窗口中显示（允许弹出窗口阻止程序）

javascript:(function() {
  var imgs = document.images,alts=[],w;
  for (var i=0;i<imgs.length;i++) {
    alts.push(imgs[i].getAttribute("alt") || "no alt");
  }
  if (alts.length>0) {
    w = window.open("","_blank");
    if (w) {
      w.document.write(alts.join("<br />"));
      w.document.close();
    }
    else {
      alert("cannot pop'n"+alts.join("'n"));
    }
  }
})()

避免重复：

更改

alts.push(imgs[i].getAttribute("alt") || "no alt");

至

var alt = imgs[i].getAttribute("alt");
if (alts && alts.indexOf(alt)==-1) alts.push(alt);
相关文章：