奇怪的bug:javascript不执行
背景:有人想要个简单的js效果,点击某个菜单,其他菜单收起。
说了下思路,结果~~
只好直接写了一个,代码如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript" src="js/jquery-1.11.3.min.js"/>
<script type="text/javascript">
$(function () {
alert("sdfsfd");
$(".content").hide();
});
$(".menu").click(function () {
$(".content").hide();
$(this).siblings().show();
}); </script> </head>
<body> <div>
<div class="menu">标题</div>
<div class="content">AAAAAAAAAAAAAAAA<br/>BBBBBBBBBBBBBBBB<br/>CCCCCCCCCCCCCCCC<br/>DDDDDDDDDDDDDDDD<br/>EEEEEEEEEEEEEEEE<br/>
</div>
</div>
<div>
<div class="menu">标题</div>
<div class="content">AAAAAAAAAAAAAAAA<br/>BBBBBBBBBBBBBBBB<br/>CCCCCCCCCCCCCCCC<br/>DDDDDDDDDDDDDDDD<br/>EEEEEEEEEEEEEEEE<br/>
</div>
</div>
<div>
<div class="menu">标题</div>
<div class="content">AAAAAAAAAAAAAAAA<br/>BBBBBBBBBBBBBBBB<br/>CCCCCCCCCCCCCCCC<br/>DDDDDDDDDDDDDDDD<br/>EEEEEEEEEEEEEEEE<br/>
</div>
</div>
<div>
<div class="menu">标题</div>
<div class="content">AAAAAAAAAAAAAAAA<br/>BBBBBBBBBBBBBBBB<br/>CCCCCCCCCCCCCCCC<br/>DDDDDDDDDDDDDDDD<br/>EEEEEEEEEEEEEEEE<br/>
</div>
</div>
<div>
<div class="menu">标题</div>
<div class="content">AAAAAAAAAAAAAAAA<br/>BBBBBBBBBBBBBBBB<br/>CCCCCCCCCCCCCCCC<br/>DDDDDDDDDDDDDDDD<br/>EEEEEEEEEEEEEEEE<br/>
</div>
</div>
<div>
<div class="menu">标题</div>
<div class="content">AAAAAAAAAAAAAAAA<br/>BBBBBBBBBBBBBBBB<br/>CCCCCCCCCCCCCCCC<br/>DDDDDDDDDDDDDDDD<br/>EEEEEEEEEEEEEEEE<br/>
</div>
</div> </body>
</html>
但是,jQuery代码一行都没执行!!!
略过期间吐血的反复试alert(),直接说结论吧:
导入script的标签,不能自闭合!!!
就是不能写成这样:<script src="..."/>
而需要写成这样:<script src="..."></script>
否则后面的第一个<script>标签整体不会执行!!!
但是不会影响第二个及以后的<script>标签。。。
如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript" src="js/jquery-1.11.3.min.js" ></script> <!--不能合并-->
<script type="text/javascript">
$(function () {
$(".content").hide();
});
$(".menu").click(function () {
$(".content").hide();
$(this).siblings().show();
});
</script> </head>
<body> <div>
<div class="menu">标题</div>
<div class="content">AAAAAAAAAAAAAAAA<br/>BBBBBBBBBBBBBBBB<br/>CCCCCCCCCCCCCCCC<br/>DDDDDDDDDDDDDDDD<br/>EEEEEEEEEEEEEEEE<br/>
</div>
</div>
<div>
<div class="menu">标题</div>
<div class="content">AAAAAAAAAAAAAAAA<br/>BBBBBBBBBBBBBBBB<br/>CCCCCCCCCCCCCCCC<br/>DDDDDDDDDDDDDDDD<br/>EEEEEEEEEEEEEEEE<br/>
</div>
</div>
<div>
<div class="menu">标题</div>
<div class="content">AAAAAAAAAAAAAAAA<br/>BBBBBBBBBBBBBBBB<br/>CCCCCCCCCCCCCCCC<br/>DDDDDDDDDDDDDDDD<br/>EEEEEEEEEEEEEEEE<br/>
</div>
</div>
<div>
<div class="menu">标题</div>
<div class="content">AAAAAAAAAAAAAAAA<br/>BBBBBBBBBBBBBBBB<br/>CCCCCCCCCCCCCCCC<br/>DDDDDDDDDDDDDDDD<br/>EEEEEEEEEEEEEEEE<br/>
</div>
</div>
<div>
<div class="menu">标题</div>
<div class="content">AAAAAAAAAAAAAAAA<br/>BBBBBBBBBBBBBBBB<br/>CCCCCCCCCCCCCCCC<br/>DDDDDDDDDDDDDDDD<br/>EEEEEEEEEEEEEEEE<br/>
</div>
</div>
<div>
<div class="menu">标题</div>
<div class="content">AAAAAAAAAAAAAAAA<br/>BBBBBBBBBBBBBBBB<br/>CCCCCCCCCCCCCCCC<br/>DDDDDDDDDDDDDDDD<br/>EEEEEEEEEEEEEEEE<br/>
</div>
</div> </body>
</html>
奇怪的bug:javascript不执行的更多相关文章
- javascript的执行顺序(转载)
之前从JavaScript引擎的解析机制来探索JavaScript的工作原理,下面我们以更形象的示例来说明JavaScript代码在页面中的执行顺序.如果说,JavaScript引擎的工作机制比较深奥 ...
- Javascript的执行过程详细研究
下面我们以更形象的示例来说明JavaScript代码在页面中的执行顺序.如果说,JavaScript引擎的工作机制比较深奥是因为它属于底层行为,那么JavaScript代码执行顺序就比较形象了,因为我 ...
- 奇怪的BUG
熟语说“常在河边走,哪能不湿鞋”,在现实中我想说:“代码写多了,总会遇到奇怪的bug”,遇到bug不可怕,可怕的是不自己不知道这么解决,有些bug能当时解决,有些在自己知识水平提高后知道如何解决.还有 ...
- JavaScript的执行上下文
在JavaScript的运行过程中,经常会遇到一些"奇怪"的行为,不理解为什么JavaScript会这么工作. 这时候可能就需要了解一下JavaScript执行过程中的相关内容了. ...
- javaScript代码执行顺序
javaScript是一种描述型脚本语言,由浏览器进行动态的解析和执行. 页面加载过程中,浏览器会对页面上载入的每个js代码块进行扫描. JavaScript是一段一段的分析执行的,在分析执行同一段代 ...
- javascript立即执行函数
javascript和其他编程语言相比比较随意,所以javascript代码中充满各种奇葩的写法,有时雾里看花;当然,能理解各型各色的写法也是对javascript语言特性更进一步的深入理解. ( ...
- JavaScript 立即执行函数
js中(function(){…})()立即执行函数写法理解 javascript和其他编程语言相比比较随意,所以javascript代码中充满各种奇葩的写法,有时雾里看花,当然,能理解各型各色的写法 ...
- 深入理解javascript中执行环境(作用域)与作用域链
深入理解javascript中执行环境(作用域)与作用域链 相信很多初学者对与javascript中的执行环境与作用域链不能很好的理解,这里,我会按照自己的理解同大家一起分享. 一般情况下,我们把执行 ...
- javascript立即执行函数 (function(){})()
看到一段代码: (function(){ var outer = $('#subject'); outer.find('li').on('mouseover', mouseover); })() ( ...
- 深入理解JavaScript系列+ 深入理解javascript之执行上下文
http://www.cnblogs.com/TomXu/archive/2011/12/15/2288411.html http://blog.csdn.net/hi_kevin/article/d ...
随机推荐
- js数组基本知识
1.数组的引出 用数组解决王大爷养乌龟的问题: var weights=[3,5,1,3.4,2,50]; var all_weight=0; var avg_weight=0; for (i=0;i ...
- nodejs request gb2312乱码的问题
http://www.cnblogs.com/linka/p/6658055.html https://cnodejs.org/topic/53142ef833dbcb076d007230 // np ...
- window 环境 Composer 安装 thinkphp5
参考链接:https://www.kancloud.cn/thinkphp/thinkphp5_quickstart/478269 在 Windows 中,你需要下载并运行 Composer-Setu ...
- Spring自带配置方式链接数据库(没有src新建文件,没有c3p0)
1.配置文件 <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http:/ ...
- shell case语法
在阅读hadoop相关的脚本文件时,遇到case语句,好久不写shell,忘了不少,复习下shell的case语句: 运行结果: ...
- Mybatis(五):Mybatis的三种使用方式
注意,这篇文章只介绍mybatis单独使用时如何操作,是没有用到spring的,如果需要了解mybatis和spring如何搭建,请移步这里Mybatis(六):spring与mybatis三种整合方 ...
- webservice快速入门-使用JAX-WS注解的方式快速搭建ws服务端和客户端(一)
1.定义接口 package org.WebService.ws.annotation; import javax.jws.WebService; @WebService public interfa ...
- GOKit全缓动类型gif列表
1.Linear 2.BackIn 3.BackInOut 4.BackOut 5.BounceIn 6.BounceInOut 7.BounceOut 8.CircIn 9.CircInOut 10 ...
- Java 并发多线程处理优秀博文整理
多线程(11)-Fork/Join-Java并行计算框架 推荐理由:Java在JDK7之后加入了并行计算的框架Fork/Join,本文是对其讲解 分解和合并:Java 也擅长轻松的并行编程! 推荐理由 ...
- 【精】iOS 文件操作:沙盒(SandBox)、文件操作(FileManager)、程序包(NSBundle)
1.沙盒机制介绍 iOS 中的沙盒机制(SandBox)是一种安全体系. 每一个 iOS 应用程序都有一个单独的文件系统(存储空间).并且仅仅能在相应的文件系统中进行操作,此区域被称为沙盒. 全部的非 ...