JS学习-JavaScript in HTML

Posted znapast

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JS学习-JavaScript in HTML相关的知识,希望对你有一定的参考价值。

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/javascriptdefer=”defer” src=”example1.js”></script>
        <script type=”text/javascriptdefer=”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/javascriptdefer src=”example1.js”></script>
    <script type=”text/javascriptasync src=”example2.js”></script>
    </head>
    <body>
    <!-- content here -->
    </body>
</html>

以上是关于JS学习-JavaScript in HTML的主要内容,如果未能解决你的问题,请参考以下文章

学习笔记---JS基础类

js中for in 和 for each in的用法和区别

JavaScript 基础学习js 和 html 的结合方式

JavaScript-学习一加载不动

学习前端JS-1

杂谈 CSS IN JS