javascript - 在使用 Jquery 或 JS 加载(或被看到)之前修改 HTML 元素

Question

我正在尝试为特定页面修改图像的 src，例如:http://oasysgp.kevinmamaqi.com/marina/ .

问题是 Logo 在原始 Logo 出现后立即更改。我正在使用以下代码:

jQuery(document).ready(function($){
    /* Cambiar el logotipo para las páginas de CPI */
    if( $('body').hasClass('page-id-18') || $('body').hasClass('page-id-445')) {
        $('#logo').attr("src","/wp-content/uploads/2016/07/oasispci.png");
    }
});

之前可以加载其他图片吗？

Answer 1

jQuery(document).ready() 总是在加载 dom 之后调用。

最好的方法，用 CSS 代码实现它。通过在 a 中设置背景而不是在图像标签中加载

CSS 看起来像这样

a.logo
{
    background: url('/wp-content/uploads/2016/07/logo-oasis.gif');
    display: inline-block;
    height: 56px !important;
    width: 223px  !important;
    margin-top: 24px  !important;
}

body.page-id-18 a.logo,  body.page-id-445 a.logo
{
    background: url('/wp-content/uploads/2016/07/oasisre.png') !important;
}

你的 logo 部分的 HTML 代码是这样的

<a href="http://oasysgp.kevinmamaqi.com/" class="logo">
</a>