ul is not defined at HTMLDocument [closed]

Question

ul is not defined at HTMLDocument [closed]

Navigation

#1 by (1 votes)
#2 by (1 votes)

0

I'm using the code below, but getting an error

function readyDom(callback) {
    if (/^(interactive|complete)$/i.test(document.readyState)) {
        callback();
    } else {
        document.addEventListener("DOMContentLoaded", callback);
    }
}
readyDom(function() {
    var navbar = document.createElement("style");
        ul.innerHTML = 'body { margin: 0; } ul.spot-nav { list-style-type: none; font-family: Verdana; margin: 0; padding: 0; overflow: hidden; background-color: #333; } li.spot-li { float: left; } li.spot-li a.spot-a { display: block; color: white; text-align: center; padding: 14px 16px; text-decoration: none; }';
    document.head.appendChild(navbar);
});
readyDom(function() {
    var segundos = 1;
    setTimeout(function() {
        var ul = document.createElement("ul");
        ul.className = "spot-nav";
        ul.innerHTML = '<li class="spot-li">' +
                          '<a class="spot-a" href="https://grupospotlight.com" target="_blank"><img src="http://www.grupospotlight.com/assets/img/logo-nav-inverse.png"draggable="false" width="100"></a>' +
                          '</li>' +
                          '<li class="spot-li" style="float: right; padding-top: 3px;">' +
                          '<a class="spot-a" href="https://grupospotlight.com" target="_blank">WWW.GRUPOSPOTLIGHT.COM</a>' +
                          '</li>';
        document.body.insertBefore(ul, document.body.firstChild);
    }, 1000 * segundos);
});

javascript

asked by anonymous 17.12.2016 / 02:47

2 answers

1

I think the problem is here:

readyDom(function() {
    var navbar = document.createElement("style");
        ====>>> ul.innerHTML = 'body { margin: 0; } ul.spot-nav { list-style-type: none; font-family: Verdana; margin: 0; padding: 0; overflow: hidden; background-color: #333; } li.spot-li { float: left; } li.spot-li a.spot-a { display: block; color: white; text-align: center; padding: 14px 16px; text-decoration: none; }';
    document.head.appendChild(navbar);
});

You are trying to access this variable ul that was not declared in the function. you stated in the third function that you posted above.

try to merge the two functions into one. this should solve your problem.

17.12.2016 / 03:57

Help with SQL Query MySql Azure connection crashes constantly

score 1 · Accepted Answer

Change ul.innerHTML = 'body... to navbar.innerHTML = 'body... .

ul is not accessible within the scope of this anonymous function, and in the background what you want is to add this CSS to the element style ( navbar ) that you will add to the right page?

function readyDom(callback) {
    if (/^(interactive|complete)$/i.test(document.readyState)) {
        callback();
    } else {
        document.addEventListener("DOMContentLoaded", callback);
    }
}
readyDom(function() {
    var navbar = document.createElement("style");
    navbar.innerHTML = 'body { margin: 0; } ul.spot-nav { list-style-type: none; font-family: Verdana; margin: 0; padding: 0; overflow: hidden; background-color: #333; } li.spot-li { float: left; } li.spot-li a.spot-a { display: block; color: white; text-align: center; padding: 14px 16px; text-decoration: none; }';
    document.head.appendChild(navbar);
});
readyDom(function() {
    var segundos = 1;
    setTimeout(function() {
        var ul = document.createElement("ul");
        ul.className = "spot-nav";
        ul.innerHTML = '<li class="spot-li">' +
            '<a class="spot-a" href="https://grupospotlight.com" target="_blank"><img src="http://www.grupospotlight.com/assets/img/logo-nav-inverse.png"draggable="false" width="100"></a>' +
            '</li>' +
            '<li class="spot-li" style="float: right; padding-top: 3px;">' +
            '<a class="spot-a" href="https://grupospotlight.com" target="_blank">WWW.GRUPOSPOTLIGHT.COM</a>' +
            '</li>';
        document.body.insertBefore(ul, document.body.firstChild);
    }, 1000 * segundos);
});