javascript - 将 jQuery 插件链接到 html

标签 javascript jquery html css

我已经检查了很多与我的错误相似的问题,但它似乎仍然不起作用。

我确信我以正确的顺序声明了这些插件,但根本没有显示任何进展。

我确实尝试在我的 codepen 帐户(都是 scss)和(编译为 css)上进行比较,它可以在 codepen 上工作,但不能在 sublime text 中工作。我发现由于某种原因它没有调用我的 main.js 。我的代码做错了什么吗?但它可以在 codepen 上运行,这让我很困惑它出了什么问题

<强> Codepen SCSS

<强> Converted to CSS

这是我在sublimetext中的html代码,与转换为css的代码相同

<!DOCTYPE html>
<html>
<head>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Crown Royale Dental</title>

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.3.4/vue.min.js"></script>
  <script type="text/javascript" href="js/main.js"></script>

  <link href="css/font-awesome.min.css" rel="stylesheet">
  <link href="css/style.css" rel="stylesheet">

</head>
<body>
    <h2>Clinic Facilities</h2>

    <div id="projectsApp">

        <div class="projects" :id="project.ID" v-for="project in projects" :style="{ backgroundImage: 'url(' + project.bImage + ')' }" v-on:click="selectProjects(project.ID)">
            <h3 class="beforeTitle"> {{ project.category }}</h3>
                <div class="info">
                    <h1 class="fadeTitle"> {{ project.category }}</h1>
                    <hr>
                </div>
            <p class="backArrow"><i class="fa fa-angle-double-left" aria-hidden="true"></i></p>
        </div>

        <div class="selectedArea">
            <h1 :style="{ backgroundImage: 'url(' + highlightedContent.bImage + ')' }"><span>{{ highlightedContent.category }}</span></h1>
                <div v-html="highlightedContent.copy" class="copyArea fadeIn"></div>
        </div>

    </div>  
</body>
</html>

main.js 和 style.css 代码很长,但与 codepen 代码相同。有谁知道是什么原因造成的吗?为什么js不工作?

这是我在 sublimetext localhost 上看到的带有检查元素的屏幕截图 Sublime text output

请参阅 codepen 链接,了解假定的输出应该是什么样子。

非常感谢那些能让我轻松起来的人。我仍在试图找出是什么原因造成的。检查可能有效的类似案例。

最佳答案

您以错误的方式使用 href 而不是 src 调用 javascript。尝试使用:

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

关于javascript - 将 jQuery 插件链接到 html,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47009324/

相关文章:

jquery - 使用数据表时水平滚动不起作用

javascript - 如何在该网页标题的帖子中执行给定数据

javascript - Angular 常数: config

javascript - 呈现页面时会自动添加内联 "display: none;"- 我可以在哪里寻找原因?

javascript - Html2Canvas 中的 HTML 字符串

java - 生成动态表以及动态单选按钮以进一步在 JSP 中生成动态表

jquery - 如何使用 jQuery 获取元素的 ID?

javascript - jquery success方法()中如何接收附加参数?

javascript - 我怎样才能用javascript为我的信制作动画

css - 使 html 内容牢不可破(一行)