JS代码的位置

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

<!--    外部JS-->
    <script type="text/javascript" src="test.js">
        alert(‘内部JS‘); //引人了外部JS,此处的内部JS不起作用
    </script>

<!--    内部JS-->
    <script type="text/javascript">
        // 从上到下一行一行执行
        alert("弹窗内容");
        document.write("向body中写入内容");
        console.log("向控制台输出日志");
    </script>
</head>
<body>
<!--内联JS-->
<!--js可以写在标签属性中,但他们属于结构与行为耦合,不方便维护,不推荐使用-->
<!--    js代码可以写在onclick属性中-->
    <button onclick="alert(‘弹窗内容‘);">点我弹窗</button>
<!--    js代码可以写在href中-->
    <a href="javascript:alert(‘弹窗内容‘);">点我弹窗</a>
    <a href="javascript:;">点我没反应</a>

</body>
</html>

原文地址:https://www.cnblogs.com/luoxuw/p/11437957.html

时间: 2024-11-05 13:47:15

JS代码的位置的相关文章

JS代码的位置与事件响应代码块的封装问题

JS代码的位置 我们可以将JavaScript代码放在html文件中任何位置,但是我们一般放在网页的head或者body部分.   放在<head>部分最常用的方式是在页面中head部分放置<script>元素,浏览器解析head部分就会执行这个代码,然后才解析页面的其余部分.   放在<body>部分JavaScript代码在网页读取到该语句的时候就会执行. ? 注意 Javascript作为一种脚本语言可以放在html页面中任何位置,但是浏览器解释html时是按先后

JS代码引用位置问题-转

看到很多JS代码全部放在head中的情况,其实这是个细节问题.转载一个知乎用户于江水的答案: 作者:于江水链接:https://www.zhihu.com/question/34147508/answer/63469443来源:知乎 浏览器加载页面是按从上到下顺序加载的.加载 JS 并执行的时候,会阻塞其他资源的加载.这是因为 JS 可能会有 DOM .样式等等操作,所以浏览器要先加载这段 JS 并执行,再加载放在它后面的 HTML.CSS. 因此,加入一段巨大的 JS 放在最上面,浏览器首先要

JS事件调试 - 查找HTML元素绑定的事件以及绑定代码所在位置

日常的网页开发调试工作中,经常需要知道指定的某个网页元素绑定了哪些事件以及绑定代码的位置,下面介绍三种用来跟踪页面中的事件的方法. 1.使用firefox调试 我们可以使用firefox的debug工具,找到指定元素,然后查看事件面板 2.使用chrome调试 在要检查的元素上单击右键选择查看元素,然后,右边的面板中会显示style标签,切换到EventListenrs标签,可以看到相关的事件绑定信息.点击最右边的文件名称还可以跳转到事件定义代码在脚本文件中的位置.不过这种方法并非总是可用,下面

JS代码存放的位置

方式一:直接在HTML网页中编写JS代码,直接使用<script></script>标签包裹起来,可以放在html里面的任何位置,推荐放在<head></head>区域中.该方式JS代码冗余,不利于程序的维护 方式二:单独编写一个js文件(.js),在使用的html/jsp中通过<script src="index.js"> </script>标签引入该技术文件,该方式实现了js代码和HTML页面的分离,有利于程序

js数组特定位置元素置空,非null和undefined,实现echarts现状图效果;谷歌格式化压缩js代码

一.想要实现eCharts线状图表的断点效果,如图 这种效果,在设置数据的时候应该是这样: data:[, 2, 3, , 5, 6, 7]:但是想要动态添加数据,实现方式有两种 1.拼接字符串法:var str='[, 2, 3, , 5, 6, 7]';var arr=eval(str); 2.改变数组长度法: var arr=[]; for(var i=1;i<8;i++){ if(i==1||i==4){ arr.length=arr.length+1; continue; }arr.p

20行js代码制作网页刮刮乐

分享一段用canvas和JS制作刮刮乐的代码,JS部分去掉注释不到20行代码效果如下 盖伦.jpg 刮刮乐.gif HTML部分 <body> ![](img/gailun.jpg) <canvas id="canvas" width="400" height="300"></canvas> </body> 没什么要特别注意的为了效果加了些CSS样式 CSS部分 <style type=&qu

JS 代码调试经验总结(菜鸟必读)

前言:不知不觉写了很多,希望你能耐心看完这篇文章 任何一个编程者都少不了要去调试代码,不管你是高手还是菜鸟,调试程序都是一项必不可少的工作.一般来说调试程序是在编写代码之后或测试期修改Bug 时进行的,往往在调试代码期间更加能够体现出编程者的水平高低以及分析问题的准确度.不少初学者在寻找错误原因时,总是不得要领,花费了大量时间却无法解决一些最终证明是相当简单的Bug. 在长期解答 zTree 相关问题时,也的确发现很多的问题其实不算什么问题,仅仅是编程者不会调试造成的,通过自己日常工作观察,这里

精品JS代码收藏大全

1. oncontextmenu="window.event.returnvalue=false" 将彻底屏蔽鼠标右键    <table border oncontextmenu=return(false)><td>no</table> 可用于Table 2. <body onselectstart="return false"> 取消选取.防止复制 3. onpaste="return false&quo

JS代码大全 (都是网上看到 自己整理的)

原文 JS代码大全 (都是网上看到 自己整理的) 事件源对象 event.srcElement.tagName  event.srcElement.type 捕获释放 event.srcElement.setCapture();   event.srcElement.releaseCapture(); 事件按键 event.keyCode  event.shiftKey  event.altKey  event.ctrlKey 事件返回值 event.returnValue 鼠标位置 event