JS学习（1）-JavaScript in HTML

最新推荐文章于 2024-10-01 10:37:20 发布

znapast

最新推荐文章于 2024-10-01 10:37:20 发布

阅读量383

点赞数

分类专栏： JS 文章标签： javascript html 浏览器

本文链接：https://blog.youkuaiyun.com/znatest/article/details/52738118

版权

JS 专栏收录该内容

0 篇文章

订阅专栏

1

为了兼容各种浏览器（xhtml,html)，在html 使用inline javascript时推荐的格式如下所示：

<script type=”text/javascript”>
//<![CDATA[
    function compare(a, b) {
        if (a < b) {
            alert(“A is less than B”);
        } else if (a > b) {
            alert(“A is greater than B”);
        } else {
            alert(“A is equal to B”);
        }
    }
//]]>
</script>

不过，推荐使用外部javascript脚本文件，而不是inline code。外部脚本文件有以下优势：可维护性，浏览器可以缓存，以及更好的兼容性。

2

常用的Doctype声明格式

<!-- HTML 4.01 Strict -->
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN”
“http://www.w3.org/TR/html4/strict.dtd”>

<!-- XHTML 1.0 Strict -->
<!DOCTYPE html PUBLIC
“-//W3C//DTD XHTML 1.0 Strict//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>

<!-- HTML5 -->
<!DOCTYPE html>

<!-- HTML 4.01 Transitional -->
<!DOCTYPE HTML PUBLIC
“-//W3C//DTD HTML 4.01 Transitional//EN”
“http://www.w3.org/TR/html4/loose.dtd”>

<!-- HTML 4.01 Frameset -->
<!DOCTYPE HTML PUBLIC
“-//W3C//DTD HTML 4.01 Frameset//EN”
“http://www.w3.org/TR/html4/frameset.dtd”>

<!-- XHTML 1.0 Transitional -->
<!DOCTYPE html PUBLIC
“-//W3C//DTD XHTML 1.0 Transitional//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>

<!-- XHTML 1.0 Frameset -->
<!DOCTYPE html PUBLIC
“-//W3C//DTD XHTML 1.0 Frameset//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd”>

3

<noscript>标签可以用于优雅地处理那些不支持脚本的浏览器的显示

<!DOCTYPE html>
<html>
    <head>
        <title>Example HTML Page</title>
        <script type=”text/javascript” defer=”defer” src=”example1.js”></script>
        <script type=”text/javascript” defer=”defer” src=”example2.js”></script>
    </head>
    <body>
        <noscript>
            <p>This page requires a JavaScript-enabled browser.</p>
        </noscript>
    </body>
</html>

4

defer 和async
defer表示脚本会立即下载带式要等html结束标签加载完时才开始执行；async表示不用等脚本加载和执行完，内容部分可以直接加载。

<!DOCTYPE html>
<html>
    <head>
    <title>Example HTML Page</title>
    <script type=”text/javascript” defer src=”example1.js”></script>
    <script type=”text/javascript” async src=”example2.js”></script>
    </head>
    <body>
    <!-- content here -->
    </body>
</html>