Question

所以我有一个HTML页面，作为我的任务的一部分，我必须拆掉HTML页面并使用Javascript重建它。我已经用javascript创建了我的网站支出，现在我想添加一些功能。

在接下来的页面中，我希望添加一个谷歌地图API并将其显示在＆＃39; MainWindow＆＃39;中，该功能在sideMenu上调用，并且已经过测试和运行。

function MainBody() {
var x = document.getElementById("mainWindow");

x.style.width = "1200px";
x.style.height = "750px";
x.style.position = "absolute";
// started using 'zIndex' to 1. orginising on the site and 2. visually show where everything is meant to be in the code
x.style.zIndex = "0";
x.style.margin = "0px 0px 0px 300px";
x.style.background = "#c01e0c";
x.style.border = "thick solid #901709";
x.style.borderWidth = "10px";
}





function setUpListener2() {
document.getElementById("listItem3").addEventListener("click", Option3, false);
}




function Option3() {
    var subX1 = document.getElementById("mainWindow");

    var map = document.createElement('DIV');
    function initMap() {
        map = new google.maps.Map(document.getElementById('map'), {
        center: {lat: -34.397, lng: 150.644},
        zoom: 8
        });
    }

    subX1.appendChild(map);
    map.style.zIndex = "1";


}

Answer 1

var my_google_script = document.createElement('script');

my_google_script.setAttribute('src','https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY');

document.head.appendChild(my_google_script);

通过Javascript插入Google API

1 个答案: