如何使用javascript创建elementor块
如何使用javascript创建elementor块
提问于 2018-09-22 23:16:07
我很难从Javascript创建新的Elementor块(在本例中，我从URL和插槽填充到列中的图像)。
我目前在我的页面中有使用html块的脚本，并且我已经设置了按钮被点击时的动作。然而，我一直找不到一个通过代码在网页上生成新的elementor块的例子。
有没有好的例子可以让我看看呢？
如果这是一个新手问题，我很抱歉。
这是我想要做的：
1)单击按钮时，清除页面的其余部分
2)生成一个新的4段分组列
3)在列的每个部分内创建1个图像块
4)使用URL中的图像填充每个图像块
提前感谢！
<script>
document.addEventListener("DOMContentLoaded", function(event) {
jQuery('.ShowAllImages').click(function(){
ShowAllImages();
});
});
function ShowAllImages() {
//Clear the page below the button
//Create x amount of grouping sections within page
//Create y new elementor images in those sections
//Populate those y elementor image blocks with images
}
</script>回答 1
Stack Overflow用户
发布于 2018-09-23 02:00:21
首先，如果您想要清除页面，我建议您使用具有唯一ID的主div或节
<section id="main">
<div id="mySections" class="row"> </div>
</section>然后你在这里添加或删除你的内容，如果我知道你想要4个部分，你可以使用bootstrap或你自己的css类在bootstrap中做这个例子：
(function (){
function ShowAllImages() {
clear();
addImages();
}
function clear() {
let parent = document.getElementById('main');
let child = document.getElementById('mySections');
parent.removeChild(child);
}
function addImages () {
let parent = document.getElementById('main');
let child1 = document.createElement('div');
child1.classList.add('col-md-3');
let child2 = document.createElement('div');
child2.classList.add('col-md-3');
let child3 = document.createElement('div');
child3.classList.add('col-md-3');
let child4 = document.createElement('div');
child4.classList.add('col-md-3');
// then you can add your images in each section with
let img1 = document.createElement('img');
child1.appendChild(img1);
// ...
parent.appendChild(child1);
parent.appendChild(child2);
parent.appendChild(child3);
parent.appendChild(child4);
}
}())我不知道你是如何获得图像的，但希望它能有所帮助，当然你可以改进这一点。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/52458049
复制相关文章
相似问题