<article>
<ul class="sm_list">
<li class="sm_Item">1</li>
<li class="sm_Item">1</li>
<li class="sm_Item">1</li>
<li class="sm_Item">1</li>
</ul>
</article>
<script>
var divElement = document.createElement("div");
divElement.className = 'sm_randImg';
divElement.innerText = 'img';
let random = Math.floor(Math.random() * 4);
var items = document.querySelectorAll('.sm_Item');
document.querySelector('.sm_list').insertBefore(divElement, items[random]);
</script>
我研究了老半天,插入了div,但是我还想在div下面插入一个img,研究了好久没整会,该怎么做?
是这样吗?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>test</title>
</head>
<body>
<article>
<ul class="sm_list">
<li class="sm_Item">1</li>
<li class="sm_Item">1</li>
<li class="sm_Item">1</li>
<li class="sm_Item">1</li>
</ul>
</article>
<script>
var divElement = document.createElement("div");
divElement.className = 'sm_randImg';
divElement.innerHTML = '<img src="https://img-home.csdnimg.cn/images/20220714095547.png"></img>';
let random = Math.floor(Math.random() * 4);
var items = document.querySelectorAll('.sm_Item');
document.querySelector('.sm_list').insertBefore(divElement, items[random]);
</script>
</body>
</html>
与其你这么写,innerhtml += innerhtml不是更方便吗
document.createElement()创建标签