所谓勇气就是明知前方的路途充满了荆棘险阻,但还是义无反顾的的走下去。

  1 Javasrcipt定义的三种方式

   ·1 head中的script脚本

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>js-01</title>
<script type="text/javascript">
alert('hello World!');
</script>
</head>
<body>
你好,body!
</body>
</html>

执行顺序是先会弹出“hello World!”,然后界面显示‘你好,body!’

   ·2 超链接中直接定义

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>js-02</title>
</head>
<body>
<a href="javascript:alert(0)">我是js</a>
</body>
</html>

这个点击超链接就会执行弹出框;

   ·3 外部引入js的方式

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>js-03</title>
<script type="text/javascript" src="index.js"></script>
</head>
<body>
<div id="mydiv">this is div</div>
</body>
</html>

index.js文件很简单:

alert("你好,index.js");

但是此时会存在问题的,如果js对div标签存在一定的操作,那么会出现问题:

修改index.js文件:

alert("你好,index.js");
// 获取div的id
var id=document.getElementById("mydiv");
alert(id);

此时由于先执行Javascript脚本,但是js获取div的id时还没有执行到div的标签,那么获取的div的id就是null.此时我们可以将script定义在div的下面,或者使用window.onload()函数来解决,此函数的功能是等待页面加载完毕之后才执行js脚本:

// 等待页面加载完毕执行js脚本
window.onload=function(){
alert("你好,index.js");
// 获取div的id
var id=document.getElementById("mydiv");
alert(id);
}

javaScript笔记01的更多相关文章

  1. javascript笔记01:javascript入门介绍

    javascript是实现网页动态效果的基石,在web开发中扮演重要的角色,被广泛应用的各个领域 (1)网页游戏 (2)地图搜索 (3)股市信息查询 (4)web聊天 …………

  2. JavaScript笔记01——数据存储(包括.js文件的引用)

    While, generally speaking, HTML is for content and CSS is for presentation, JavaScript is for intera ...

  3. JavaScript看书笔记01

    JavaScript看书笔记... ------------------- JavaScript允许var定义语句出现在函数内部的任意位置.JS中使用Var来显示的给变量声明 JavaScript是一 ...

  4. JS自学笔记01

    JS自学笔记01 1.开发工具 webstorm 2.js(javascript) 是一门脚本.解释性.动态类型.基于对象的语言 含三个部分: ECMAScript标准–java基本语法 DOM(Do ...

  5. javascript基础01

    javascript基础01 Javascript能做些什么? 给予页面灵魂,让页面可以动起来,包括动态的数据,动态的标签,动态的样式等等. 如实现到轮播图.拖拽.放大镜等,而动态的数据就好比不像没有 ...

  6. 软件测试之loadrunner学习笔记-01事务

    loadrunner学习笔记-01事务<转载至网络> 事务又称为Transaction,事务是一个点为了衡量某个action的性能,需要在开始和结束位置插入一个范围,定义这样一个事务. 作 ...

  7. 《30天自制操作系统》笔记(01)——hello bitzhuwei’s OS!

    <30天自制操作系统>笔记(01)——hello bitzhuwei's OS! 最初的OS代码 ; hello-os ; TAB=4 ORG 0x7c00 ; 指明程序的装载地址 ; 以 ...

  8. 《The Linux Command Line》 读书笔记01 基本命令介绍

    <The Linux Command Line> 读书笔记01 基本命令介绍 1. What is the Shell? The Shell is a program that takes ...

  9. [Effective JavaScript 笔记] 第4条:原始类型优于封闭对象

    js有5种原始值类型:布尔值.数字.字符串.null和undefined. 用typeof检测一下: typeof true; //"boolean" typeof 2; //&q ...

随机推荐

  1. 小学生都能看懂的数位dp

    前言 数位dp其实很久前就知道了,也做过几道和其他算法混在一起的题目,其实通过手玩是能做的 但毕竟是种算法,还是系统学下比较好(节省手玩时间) 模板题 P2602 [ZJOI2010]数字计数 化简题 ...

  2. Elipse 快捷键

    1. eclipse里面如何快速收缩当前类文件里面的所有方法和注释收缩:ctrl+shift+/展开:ctrl+shift+*注意:这个/和*要是数字键盘上的/和*.   2. shift+enter ...

  3. QT 巧用QSignalMapper分类有序地处理大量信号

    转自--> http://blog.csdn.net/cuteqt/article/details/4306900 QSignalMapper这个类并不是个新鲜概念, 早在Qt2里就已经存在, ...

  4. java原生数据类型和引用类型

    java 中String 是个对象,是引用类型基础类型与引用类型的区别是,基础类型只表示简单的字符或数字,引用类型可以是任何复杂的数据结构基本类型仅表示简单的数据类型,引用类型可以表示复杂的数据类型, ...

  5. Android GreenDao 中文表名,中文字段DAO生成乱码的问题

    在gradle.properties 文件中加入编码类型 # Project-wide Gradle settings. # IDE (e.g. Android Studio) users: # Gr ...

  6. CSS3分享功能

    [代码][CSS]代码  $.fn.share = function(opts) {  var $body, $head;  if ($(this).length === 0) {    consol ...

  7. linux应用之yum命令的软件源的更换(centos)

    [1] 首先备份/etc/yum.repos.d/CentOS-Base.repo mv /etc/yum.repos.d/CentOS-Base.repo /etc/yum.repos.d/Cent ...

  8. python 正则表达式(一)

    正则表达式(简称RE)本质上可以看作一个小的.高度专业化的编程语言,在Python中可以通过re模块使用它.使用正则表达式,你需要为想要匹配的字符串集合指定一套规则,字符串集合可以包含英文句子.e-m ...

  9. SpringBoot_04_热部署

    二.参考资料 1.Spring Boot 系列(六)web开发-Spring Boot 热部署

  10. Java微信小程序开发_00_资源帖

    1.微信小程序开发:http://blog.csdn.net/column/details/13721.html?&page=1 2.微信小程序栏目:http://blog.csdn.net/ ...