Question

每一个人。我现在正在学校学习JavaScript。我们的老师建议我们不要使用突兀的JavaScript。所以我想知道innerHTML是否突兀，非常感谢你！

Answer 1

没有任何属性本质上是突兀或不引人注目的JavaScript的一部分。

JavaScript是否不引人注目取决于它的设计方式when the JS fails。

这是突兀的。如果JS没有工作，那么没有任何事情发生。

<button type="button">
    Show the answer
</button>
<script>
    document.querySelector("button").addEventListener("click", show);
    function show() { document.body.innerHTML = "The answer"; }
</script>

这不引人注目。如果JS不起作用，那么JS的功能将被服务器端回退所取代。

<a href="the-answer.html">
    Show the answer
</a>
<script>
    document.querySelector("a").addEventListener("click", show);
    function show(e) { 
        e.preventDefault();
        document.body.innerHTML = "The answer"; 
    }
</script>

这是不显眼的（提供功能并不重要）。如果JS不起作用，则按钮根本不显示（因此没有破坏的按钮）。

<script>
    var button = document.createElement("button");
    button.type = "button";
    document.body.appendChild(button);
    button.addEventListener("click", show);
    function show() { 
        document.body.innerHTML = "The answer"; 
    }
</script>

Answer 2

我认为你的老师希望你避免使用内联javascript等。

从Wikipedia的设置点击处理程序的示例中可以看出，而不是内联的onclick函数。

https://en.wikipedia.org/wiki/Unobtrusive_JavaScript#Separation_of_behavior_from_markup

Answer 3

这取决于您如何使用它。

例如，如果您在用户点击此类链接作为AJAX请求的一部分后，您正在使用innerHTML更改其他元素的内部工作方式：

<a href="#" id="link1" onclick="document.getElementById('element').innerHTML=['page.html' contents]">View Page</a>

...比不是，你正在突然使用它。如果你要做这样的事情：

<a href="page.html" id="link1" class="ajax-link">View Page</a>

并且您有一个外部JavaScript文件来处理修改另一个元素的innerHTML的代码，而不是您不引人注意地使用它。

第一个例子是突兀，因为该链接会显示＆＃39; page.html＆＃39;的内容。对于启用了JavaScript但没有启用JavaScript的用户。

第二个例子是不显眼的，因为无论有没有JavaScript，用户都会看到＆＃39; page.html＆＃39;

的内容

阅读以下内容：

归结为：您的网站及其内容在JavaScript不可用时仍然可以访问 - 这是保证这一点的唯一方法是通过使用Unobtrusive JavaScript技术。

来源：http://blog.teamtreehouse.com/unobtrusive-javascript-important

innerHTML是否是突兀的JavaScript？

3 个答案: