早上好
我试图在一个部分中随机放置一些Font Awesome星,星数取决于数组中元素的数量。
我编写了以下代码,但它无效。我已经测试了jQuery和Font Awesome都正确加载了。
有人可以提出建议吗?
$(document).ready(function() {
var star = '<i class="fa fa-star" aria-hidden="true"></i>'; // Define star to insert later
var starArray = ["Apple", "Pear", "Banana"]; // Define array
var section = document.getElementById('section-for-stars'); // Get id of section where stars are to be randomly places
var width = section.offsetWidth; // Get section width
var height = section.offsetHeight; // Get section height
for (var i=0; i<starArray.length;i++) { // for loop array.length output star onto .section-contact
var posx = Math.floor(Math.random()*width); // Define random position x
var posy = Math.floor(Math.random()*height); // Define random position y
star.appendTo(section).css({ // Append
'position':'absolute',
'left':posx+'px',
'top':posy+'px',
});
}
});
答案 0 :(得分:1)
首先需要找到一种方法将两个元素作为html dom元素而不是字符串开始和分段。那么只有你可以使用追加方法。
这里我使用了一个假div,以便我可以将元素作为DOM,你甚至可以使用$(star as string html)
var div = document.createElement('div');
div.innerHTML = star;
var element = div.childNodes[0];
console.log(element)
$(element).appendTo(section).css({ // Append
'position':'absolute',
'left':posx+'px',
'top':posy+'px',
});