js报错cannot read properties of null(reading appendChild)解决办法

起因
js渲染，香江一个新创建的节点加入css的节点中，成为它的子节点

chooseArea();
				function chooseArea(){
					// 获取chooseArea容器
					var chooseArea = document.querySelector('.mainCon .chooseWrap .choose .chooseArea ');
					// console.log(chooseArea);
					// 获取数据
					var crumbData = goodData.goodsDetail.crumbData;
					// 遍历数组
					crumbData.forEach(function(item){
						// 创建dl容器
						var dlNode = document.createElement('dl');
						// 创建dt
						var dtNode = document.createElement('dt');
						// 将每一个对象中的title的属性，作为dt的文本
						dtNode.innerHTML = item.title;
						dlNode.appendChild(dtNode);
						// 遍历每个对象的data，这里的item对应每一个对象的选项的文本
						item.data.forEach(function(item){
							// 创建dd
							var ddNode = document.createElement('dd');
							ddNode.innerHTML = item;
							dlNode.appendChild(ddNode);
							// console.log(ddNode);
						});
						chooseArea.appendChild(dlNode);
						// console.log(dlNode);
					})
				// console.log(chooseArea);
			}

报错
cannot read properties of null(reading appendChild)
大致意思是不能取空的属性
解决过程
console.log(chooseArea);//打印这个父节点里面的内容，看是否能获取到东西，如果是null则说明你获取chooseArea这个节点的路径有问题，建议重新获取
我的就是获取路径有问题，所以出了问题；
其他办法
我在网上也找了其他解决办法，不过没有解决我的问题，如果上述解决办法没有帮助到你，可以试试下面的办法：

数据没有加载完成就进行渲染，建议将js代码放在body后面可以试试；