gpt4 book ai didi

javascript - JavaScript代码未在浏览器中执行

转载 作者:可可西里 更新时间:2023-11-01 12:49:31 26 4
gpt4 key购买 nike

我正在尝试从各种在线教程中学习编程,并且在过去三天里一直试图弄清楚这个问题,但没有成功。我有三个文件(myindex.html,stylesheet.css和jscript.js),在尝试尝试不同的东西之前,我试图确保所有内容都正确链接。

MyIndex.html文件包含:

   <!DOCTYPE>
<HTML>
<head></head>
<title>Mary</title>
<link href="stylesheet.css" type="text/css" rel="stylesheet"></link>
<script type="text/javascript" src='http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js'></script>

<body>
<div ID="contact">Hello</div>
</body>
</HTML>

我的stylesheet.css文件包含:
#contact {
height: 100px;
width: 100px;
background-color: #517F8F;
border-radius: 25px;
border: 2px solid blue;
text-align: center;
display: block;
vertical-align: middle;
line-height: 100px;
}

我的jscript.js文件包含:
$(document).ready(function(){
$('#contact').click(function(){
$(this).hide();
}();
});

我一直将文件拖到chrome中,看是否能正常工作。它显示div元素,但单击时不会隐藏它。沮丧之后,我将所有信息都输入了jsfiddle中,并说它可以正常工作,如果单击该元素,则在结果窗口中,它会像预期的那样隐藏。我正在使用sublime对其进行编辑,但是我也尝试了notepad ++。当我将索引文件拖到浏览器中时,我不知道为什么它不能正常工作。我知道这可能是一个愚蠢的问题,对此我深表谢意。

更新!

修复错误后,我的代码如下所示:

MyIndex.html
<!DOCTYPE HTML>
<HTML>
<head></head>
<title>Mary Bishop</title>
<link href="stylesheet.css" type="text/css" rel="stylesheet">
<script type="text/javascript" src='http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js'></script>
<script type="text/javascript" src="jscript.js"></script>

<body>
<div ID="contact">Hello</div>
</body>
</HTML>

Stylesheet.css尚未更改。

jscript.js文件是
$(document).ready(function(){
$('#contact').click(function(){
$(this).hide();
});
});

我在谷歌浏览器中打开它,它给了我{}。而已。页面左上角只有一对大括号。我尝试了检查元素功能,但是我不确定我在那儿寻找什么。如果它告诉我有错误,则不是在告诉我该错误是什么。

最佳答案

两件事,一件事肯定是破坏事物,另一件事只是语法错误。

  • 您丢失了:
    <script type="text/javascript" src="jscript.js"></script>

    MyIndex.html中。在包含jQuery *的<script>...</script>标记之后立即添加它。这告诉浏览器您的JavaScript文件在哪里,就像在link元素中包含样式表一样。
  • }();应该是});文件第4行中的jscript.js


  • *注意:您可以改为在 jscript.js之后的 <div ID="contact">Hello</div>标记结尾之前添加 body文件。无论哪个地方都可以,您只需将其放在jQuery之后。但是,在所有HTML元素之后将其包含在 body标记中,可以稍微加快页面的呈现速度,因为浏览器直到加载其余的 jscript.js才开始获取 body文件。由于无论如何都在等待文档准备就绪,因此性能提升很小。

    关于javascript - JavaScript代码未在浏览器中执行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18295977/

    26 4 0
    文章推荐: javascript - jQuery : progress bar show in html
    文章推荐: php - php 中的特殊标签
    文章推荐: php - PDO lastInsertId 问题,php
    文章推荐: javascript - 如何使用 javascript 函数使隐藏的 html
    Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
    广告合作:1813099741@qq.com 6ren.com