Javascript 在BlogEngine.NET中的外部链接旁边显示Favicon

我想在BlogEngine.NET中为我的文章中的任何外部链接显示favicon，因此我在母版页主题中使用以下代码：

    <script type="text/javascript">
        $("a[href^='http']").each(function () {
            $(this).css({
                background: "url(http://www.google.com/s2/favicons?domain=" + this.hostname +
                ") right center no-repeat",
                "padding-right": "20px"
            });
        });
    </script>

$（“a[href^='http']）。每个（函数（）{
$（this.css）({
背景：“url(http://www.google.com/s2/favicons?domain=“+this.hostname+
）右中不重复“，
“右边填充”：“20px”
});
});

但它显示页面中所有超链接的功能，如页眉和页脚、导航菜单等。
我只想在我的博客帖子中显示favicons，而不是整个页面的链接。
我知道我必须为上述代码指定css类名，但我不知道如何才能做到这一点。
BlogEngine.NET中的所有帖子都位于带有“post”css类名的div标记下

 <div id="ctl00_cphBody_PostList1_posts" class="posts">    
    <article id="post0" class="post">
           <h2 class="post-title">
        <div class="post-info Clear">
        <div class="post-body text">
        <p dir="rtl" style="text-align: right;">
            Some text...</p>
            <a target="_blank" href="http://www.microsoft.com">Microsoft1 </a> /* Favicon css does not effect here! */
              <span class="someclass1">
                 <p class="someclass2">
                    Some Text...
                    <a target="_blank" href="http://www.microsoft.com">Microsoft2 </a> /* Favicon css does not effect here! */
                 </p>
              </span>
        </div>
    </article>

/*Favicon css在这里不起作用*/

一些文字。。。
/*Favicon css在这里不起作用*/

我怎样才能知道带有“post”css类的div中的所有链接必须显示favicon而不是正文页中的所有链接？
我使用BlogEngine2.9

---

高级版谢谢。

然后您可以添加如下内容：

在JSFIDLE有两种方法：

（我不是jQuery开发人员，因此它可能有另一种/更好的语法）

如果类名等于“post”

您可以将它与一个或多个测试结合起来

<div id="ctl00_cphBody_PostList1_posts" class="posts">
    <article id="post0" class="post">
        <h2 class="post-title">Title</h2>    
        <div class="post-info Clear">
            <div class="post-body text">
                <a href="http://www.google.com">link</a>
                <a href="http://www.google.com">link</a>
            </div>
        </div>
    </article>
</div>


$("a[href^='http']").each(function () {

    if (this.parentNode.className.substring(0, 4).toLowerCase() == "post" &&
        this.parentNode.tagName.toLowerCase() == "div" &&
        this.parentNode.parentNode.tagName.toLowerCase() == "div" &&
        this.parentNode.parentNode.parentNode.tagName.toLowerCase() == "article"
       )
    {
        $(this).css({
            background: "url(http://www.google.com/s2/favicons?domain=" + this.hostname + ") right center no-repeat", "padding-right": "20px"
        });
    }      
});

$（“a[href^='http']）。每个（函数（）{
if（this.parentNode.className.substring（0,4）.toLowerCase（）=“post”&&
此.parentNode.tagName.toLowerCase（）=“div”&&
此.parentNode.parentNode.tagName.toLowerCase（）=“div”&&
this.parentNode.parentNode.parentNode.tagName.toLowerCase（）=“article”
)
{
$（this.css）({
背景：“url(http://www.google.com/s2/favicons?domain=“+this.hostname+”）右中不重复“，”右填充“：“20px”
});
}      
});

您的外部链接与内部链接有何不同？BlogEngine.NET中的所有博客文章都位于带有“post”css类名的div标记下。这些是外部链接，他们必须有favicon。谢谢你的答复，我尝试你的代码，但没有favicon显示。（包括外部或内部链接）。似乎找不到“post”类名。发布部分HTML请检查我的更新。。。它找不到它，因为第一个父级不是包含“post”类的父级，但是任何已知的类名都可以用于父级，或者您只需检查父级，直到您找到再次更新的匹配项。。如何找到以“post”开头的类名，如“post0”或“post body text”，幸运的是不起作用，下面一行包含了post类：（再次查看我的问题）。

        if (this.parentNode.parentNode.className.substring(0, 4) =....

        if (this.parentNode.className == "post") {

<div id="ctl00_cphBody_PostList1_posts" class="posts">
    <article id="post0" class="post">
        <h2 class="post-title">Title</h2>    
        <div class="post-info Clear">
            <div class="post-body text">
                <a href="http://www.google.com">link</a>
                <a href="http://www.google.com">link</a>
            </div>
        </div>
    </article>
</div>


$("a[href^='http']").each(function () {

    if (this.parentNode.className.substring(0, 4).toLowerCase() == "post" &&
        this.parentNode.tagName.toLowerCase() == "div" &&
        this.parentNode.parentNode.tagName.toLowerCase() == "div" &&
        this.parentNode.parentNode.parentNode.tagName.toLowerCase() == "article"
       )
    {
        $(this).css({
            background: "url(http://www.google.com/s2/favicons?domain=" + this.hostname + ") right center no-repeat", "padding-right": "20px"
        });
    }      
});