未捕获的类型错误：无法设置未定义的属性“背景”

Posted 2023-02-25

【中文标题】未捕获的类型错误：无法设置未定义的属性“背景”

【英文标题】：Uncaught TypeError: Cannot set property 'background' of undefined

【发布时间】：2016-05-13 09:44:31

【问题描述】：

我正在尝试在页面加载时加载 css 背景图像，但出现此错误

function loadBG() 
    document.getElementsByClassName("img-icon-invite").style.background = "url('<?php echo Yii::app()->theme->baseUrl; ?>/style/home/images/firstProPopup-sprite-new-white.png')";
    document.getElementsByClassName("img-icon-verified").style.background = "url('http://dev1.venturepact.com/themes/adminre/style/home/images/firstProPopup-sprite-new-white.png')";


window.onload = loadBG();

【问题讨论】：

也分享html

getElementsByClassName 获取值数组，如您在其名称中看到的 getElements

getElementsByClassName 返回一个数组，因此您需要通过索引访问每个元素。

【参考方案1】：

由于getElementsByClassName返回元素数组，你也需要指定索引，

document.getElementsByClassName("img-icon-invite")[0].style.background="url('<?php echo Yii::app()->theme->baseUrl;?>/style/home/images/firstProPopup-sprite-new-white.png')";

或者使用 Jquery 你可以做到，

$(".img-icon-invite").css('background-image', 'url(' + imageUrl + ')');

【参考方案2】：

正如你提到的 jQuery：

function loadBG()
        $(".img-icon-invite").css('background-image', "url('<?php echo Yii::app()->theme->baseUrl;?>/style/home/images/firstProPopup-sprite-new-white.png')";
        $(".img-icon-verified").css('background-image',"url('http://dev1.venturepact.com/themes/adminre/style/home/images/firstProPopup-sprite-new-white.png')";


$(document).ready(loadBG);