在Java脚本中嵌入字体真棒图标

Embedding Font Awesome Icon inside of Java Script

本文关键字:字体 图标 Java 脚本      更新时间:2023-09-26

嗨,我正试图在一些JavaScript中嵌入一个字体很棒的图标。JavaScript(我在网上找到的)在我的网站上创建了自动面包屑。这是JavaScript:

<script language="JavaScript">
function breadcrumbs(){
  sURL = new String;
  bits = new Object;
  var x = 0;
  var stop = 0;
  var output = "<a href='"/'">home</a> &nbsp;>&nbsp; "; 
  sURL = location.href;
  sURL = sURL.slice(8,sURL.length); 
  chunkStart = sURL.indexOf("/");
  sURL = sURL.slice(chunkStart+1,sURL.length)
  while(!stop){
    chunkStart = sURL.indexOf("/");
    if (chunkStart != -1){
      bits[x] = sURL.slice(0,chunkStart)
      sURL = sURL.slice(chunkStart+1,sURL.length);
    }else{
      stop = 1;
    }
    x++;
  }
  for(var i in bits){
    output += "<a href='"";
    for(y=1;y<x-i;y++){
      output += "../";
    }
    output += bits[i] + "/'">" + bits[i] + "</a> &nbsp;>&nbsp; ";
  }
  document.write(output + document.title);
}
<!--
breadcrumbs();
 -->
</script>

这个代码运行得很好,完全符合我的要求。但我想显示一个字体Awesome Icon来代替单词"home"。

这里写着家。

var output = "<a href='"/'">home</a> &nbsp;>&nbsp; "; 

我把它改成…

var output = "<a href='"/'"><i class="fa fa-home fa-lg"></i></a> &nbsp;>&nbsp; "; 

以为它会显示字体很棒的图标,而不是单词"home"但它实际上只是破坏了代码,什么也不显示。

我是JavaScript的新手,所以我不知道为什么它不起作用。请帮忙!

用单引号而不是双引号包装输出,这样它就不会与class="fa fa-home fa-lg"的双引号冲突。这也将允许您删除href附近的'"

var output = '<a href=""><i class="fa fa-home fa-lg"></i></a>&nbsp;>&nbsp;'; 

'"用于转义被双引号包围的字符串中的双引号。虽然它工作得很好,但可读性较差。有关字符串用法的更多信息,请参阅此文档。

您应该使用""''的组合,使字符串连接变得简单易读。

var output = "<a href='/'><i class='fa fa-home fa-lg'></i></a> &nbsp;>&nbsp; "; 

会起作用的。