Question

innerHTML正在使用控制台，它正在改变锚标签中的文本但是在浏览器中显示，它没有改变。我给登录的标签是＆＃34; changeIt＆＃34;然后使用getElementByID（）检索ID;功能，最后改变了它的文本。我在

标签的情况下做了同样的事情而没有使用Materialize，它正在工作。 DOM不能与物化CSS框架一起使用吗？

<!DOCTYPE html>
<html lang="en">

<head>
    <title>Skynet | Live courses from Universites</title>
    <link rel="stylesheet" type="text/css" href="css/materialize.min.css">
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="css/styles.css">
    <meta name="viewport" content="width=device-width,initial-scale=1.0" />
</head>

<body>
<script type="text/javascript" src="js/materialize.min.js"></script>
<script type="text/javascript" src="js/jquery.js"></script>

<script>
    function init() {
        var name = document.getElementById("changeIt");
        console.log("blah");
        name.innerHTML = "Alex";
        console.log(name);
    }
    window.onload = init;
</script>

<!-- NAVIGATION BAR -->
<div>
    <nav class="teal">
        <div class="container">
            <div class="nav-wrapper">
                <a href="#" class="brand-logo flow-text"><i class="material-icons left">account_balance</i>Skynet</a>
                <a href="#" data-activates="mobile-demo" class="button-collapse"><i class="material-icons">menu</i></a>
                <ul class="right hide-on-med-and-down">
                    <li><a href="#">Become a Creator</a></li>
                    <li><a href="#">Courses</a></li>
                    <li><a href="#">Contacts</a></li>
                    <li><a class="modal-trigger" href="#login"><i class="material-icons right">person</i>Login</a></li>
                </ul>
                <ul class="side-nav" id="mobile-demo">
                    <li><a href="#">Become a creator</a></li>
                    <li><a href="#">Courses</a></li>
                    <li><a href="#">Contacts</a></li>
                    <li><a class="modal-trigger" href="#login" id="changeIt"><i class="material-icons">person</i>Login</a></li>
                </ul>
            </div>
        </div>
    </nav>
</div>
<!--LOGIN POP-UP CONTENT-->

<div id="login" class="modal">
    <div class="modal-content modal-close">
        <h4 class="header center-align">Skynet</h4>
        <p class="flow-text center-align">Sign in to Skynet with</p>
        <div class="center-btn">
            <a href="#" class="btn waves-effect waves-light google_button"><i class="ion-social-google left"></i>Google</a>
        </div>
    </div>
</div>
</body>

</html>

运行此控制台后，控制台中的值正在改变 - 嗒嗒

<a class="modal-trigger" href="#login" id="changeIt">Alex</a>

Answer 1

使用此 -

$(document).ready(function() {
    $('#change').text("Alex");
});

innerHTML不会在Materialize中更改浏览器上的文本

1 个答案: