Question

我正在尝试集成一个简单的html，js和css文件：

就像这个链接上的这个例子：jsfiddle.net/MHDhT

我可以像这样（在head标签中）将没有问题链接到css文件：

<link rel="stylesheet" href="style.css" />

但后来我不知道如何链接到js文件，我不确定如果只有我可以在该链接上看到的js内容就足够了？

有人能帮帮我吗？

Answer 1

您的js应在位于页面末尾以便加载效果。（就像浏览器可以在js完成加载之前开始渲染网页一样）。但是，只有你的Js不是强制你的Dom加载（应该是这样）

您可以通过两种不同的方式链接它们：

<script type="text/javascript">
   //Here is your code
</script>

或者

<script type="text/javascript" src="url_of_your_js.js"></script>

修改

一定要包含jquery：

<head>
     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
</head>

如果您的代码要求dom准备好执行，则应使用

$(document).ready(function() {
  //This is executed when dom is ready
});

最终的结果应该是这样的:(我把所有的In 1文件都更方便了）

<html>
    <head>
        <style type"text/css">
              .menu { 
              background: #3B6997;
              font-weight: bold;
              padding: 10px;
              width: 300px;
              display:none;
              }
              .menu a {
              color: white;
              }
              .hov {
              width: 300px;   
              }

    </style>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $('.hov').hover(function() {
                $('.menu').slideDown();
            }, function() {
                $('.menu').slideUp();
            });
        });
    </script>
</head>
<body>
    <div class="hov">
        <a href="#">Activate Menu vv</a>

        <ul class="menu">
            <li>
                <a href="#">Item</a>
            </li>
        </ul>
    </div>
</body>
</html>

如果你想把你的js放在单独的文件中，让我们说'app.js'，把它放在这个文件中：

$(document).ready(function() {
    $('.hov').hover(function() {
        $('.menu').slideDown();
    }, function() {
        $('.menu').slideUp();
    });
});

你可以把它放在头部：

<script type="text/javascript" src="app.js"></script>

Answer 2

在JSFiddle中，您无需指定这些html，head，external css或js标记。但是在你的.html中它是必须的。 script标记用于链接javascript文件。

<html>
        <head>
        <link rel="stylesheet" href="/folderpath/style.css" />
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
        <script type="text/javascript" src="/folderpath/filename.js"></script>
        </head>
        <body></body>
</html>

Answer 3

要将JavaScript插入HTML页面，请使用.html文件中的<script>标记

<script>
   //Your js code here 
</script>

要包含单独的文件（.js），请使用：

<script type="text/javascript" src="mycode.js"></script>

整合javascript文件，用html - 简单的例子

3 个答案:

您可以通过两种不同的方式链接它们：

或者

修改