我无法将样式应用于使用创建的元素.insertAdjacentHTML。
我试过使用，.style.cssText但不起作用。
JS：
function addTime(){
const newTimeSpan=document.createElement('span');
const date=new Date();
const currentTime=`${addZero(date.getHours())} : ${addZero(date.getMinutes())} : ${addZero(date.getSeconds())}`
const newTimeSpanText=document.createTextNode(currentTime);
newTimeSpan.appendChild(newTimeSpanText);
newTimeSpan.style.cssText="border:solid 1px black;padding:2px;margin-right:10px;";
const liItem=document.querySelector('li');
liItem.insertAdjacentHTML('afterbegin',newTimeSpan.innerHTML)
}
addTime();
HTML：
<div class="list-box">
<ul class="list">
<li class="item">item 1</li>
<li class="item">item 2</li>
<li class="item">item 3</li>
<li class="item">item 4</li>
</ul>
</div>
我实际上希望周围没有newTimeSpan.innerHtml它的边界。
使用insertAdjacentElement并插入元素，而不是其内容。
(function() {
const newTimeSpan = document.createElement('span');
const date = new Date();
const currentTime = `${new Date().getHours()} : ${new Date().getMinutes()} : ${new Date().getSeconds()}`
const newTimeSpanText = document.createTextNode(currentTime);
newTimeSpan.appendChild(newTimeSpanText);
newTimeSpan.style.cssText = "border:solid 1px black;padding:2px;margin-right:10px;";
const liItem = document.querySelector('li');
liItem.insertAdjacentElement('afterbegin', newTimeSpan);
})()<div class="list-box">
<ul class="list">
<li class="item">item 1</li>
<li class="item">item 2</li>
<li class="item">item 3</li>
<li class="item">item 4</li>
</ul>
</div>本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句