JavaScript学习的教程来自后盾网

1>JavaScript的放置和注释

  1.输出工具

    A.alert();

    B.document.write();

    C.prompt("","");

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>输出函数测试</title>
</head> <body>
<script>
<!-- 弹出对话框显示 -->
alert("<h1>后盾网</h1>"); <!-- 页面显示 -->
document.write("<h1>后盾网视频教程</h1>"); <!-- 弹出输入对话框,一个提示参数,一个输入参数 -->
var value=prompt("please enter your name","")
<!-- 显示输入的参数 -->
alert(value);
</script>
</body>
</html>

  2.JavaScript如何在html页面当中进行放置

    A.<script></script>  放在<head></head>中间,也可以放在<body></body>中间,有两个属性,一个是type,另外一个是language

      div中加样式:写class,<div class="one"></div>,然后在<head></head>中写<style></style>

<style>
.one{
width:100px;
height:100px;
background:red;
font-size:12px;
color:blue;
}
</style>

     JavaScript可以在html页面当中的任何位置来进行调用,但是他们还是一个整体,是相互联系,相互影响。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>javascript放置</title>
<script type="text/javascript" language="javascript" >
var a="我是后盾网"
</script>
<style>
.one{
width:100px;
height:100px;
background:red;
font-size:12px;
color:blue;
}
</style>
</head> <body> <script type="text/javascript" language="javascript">
a="我是论坛,bbs.houdunwang.com"
document.write(a);
</script> <div class="one">
欢迎收看后盾网视频教程,收看更多原创视频请到后盾网论坛下载!
</div> <script type="text/javascript" language="javascript">
alert(a);
</script>
</body>
</html>

    B.可以在超链接或是重定向的位置调用javascript代码

      格式:"javascript:alert('我是超链接')"
      重定向格式:action="javascript:alert('我是表单')"

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>place2</title>
<style>
.one{
width:100px;
height:100px;
background:red;
font-size:12px;
color:blue;
}
</style>
</head> <body>
<div class="one">
欢迎收看后盾网视频教程,收看更多原创视频请到后盾网论坛下载!
</div> <!-- 点击链接,弹出对话框 -->
<a href="javascript:alert('我是超链接')">链接</a> <!-- from表单,提交表单后弹出对话框 -->
<form action="javascript:alert('我是表单')" method="post">
<input type="text" name="names">
<!-- type是submit,点击按钮后直接提交表单 -->
<input type="submit" value="提交">
</form>
</body>
</html>

   C.在事件后面进行调用
     1>.格式:onclick="alert('我是事件')"
     2>.<script for="two" event="onclick">
         alert("我是DIV2");
      </script>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>place3</title>
<style>
.one{
width:100px;
height:100px;
background:red;
font-size:12px;
color:blue;
} .two{
width:200px;
height:300px;
background:blue;
font-size:12px;
color:red;
}
</style> <!-- for属性表示为了那个ID,一般不用 -->
<script for="two" event="onclick">
alert("我是DIV2");
</script>
</head> <body>
<!-- 点击这个div弹出对话框 -->
<div class="one" onclick="alert('我是事件')">
欢迎收看后盾网视频教程,收看更多原创视频请到后盾网论坛下载!
</div> <div class="two" id="two">
欢迎收看后盾网视频教程,收看更多原创视频请到后盾网论坛下载!
</div> </body>
</html>

   3.调用外部javascript文件

    格式: <script src="2.js"></script>  在<head></head>中加入

<script src="2.txt"></script>

    js文件

var a="后盾网视频教程";
alert(a);

    注意:在调用页面<script>标签对当中不能有任何代码、在js脚本中不能出现<script>标签对、但是他们还是一个整体,是相互联系,相互影响。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>place4</title>
<!-- 调用外部js文件 -->
<script src="2.txt"></script>
<style>
.one{
width:100px;
height:100px;
background:red;
font-size:12px;
color:blue;
} .two{
width:200px;
height:300px;
background:blue;
font-size:12px;
color:red;
}
</style>
<script>
<!--
//a="bbs.houdunwang.com";
//alert(a);
//后盾网
/*
后盾网网
视频教程
bbs.houdunwang.com
*/
-->
</script>
</head> <body>
<div class="one" >
欢迎收看后盾网视频教程,收看更多原创视频请到后盾网论坛下载!
</div> <div class="two" id="two">
欢迎收看后盾网视频教程,收看更多原创视频请到后盾网论坛下载!
</div> </body>
</html>

  4.javascript注释:
    1.对付旧的浏览器
      <!-- -->
    2.真正注释符号。
      A.行内注释 //
      B.块注释/*

        */

JavaScript学习笔记——基本知识的更多相关文章

  1. jQuery学习笔记 - 基础知识扫盲入门篇

    jQuery学习笔记 - 基础知识扫盲入门篇 2013-06-16 18:42 by 全新时代, 11 阅读, 0 评论, 收藏, 编辑 1.为什么要使用jQuery? 提供了强大的功能函数解决浏览器 ...

  2. JavaScript:学习笔记(8)——对象扩展运算符

    JavaScript:学习笔记(8)——扩展运算符 对象的扩展运算符 扩展运算符是三个点(...).用于取出参数对象的所有可遍历属性,然后拷贝到当前对象之中. 如上图所示,新建了一个对象a,然后通过扩 ...

  3. JavaScript:学习笔记(5)——箭头函数=>以及实践

    JavaScript:学习笔记(5)——箭头函数=>以及实践 ES6标准新增了一种新的函数:Arrow Function(箭头函数).本文参考的链接如下: MDN箭头函数:https://dev ...

  4. Java程序猿的JavaScript学习笔记(汇总文件夹)

    最终完结了,历时半个月. 内容包含: JavaScript面向对象特性分析,JavaScript高手必经之路. jQuery源代码级解析. jQuery EasyUI源代码级解析. Java程序猿的J ...

  5. Java程序猿的JavaScript学习笔记(8——jQuery选择器)

    计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...

  6. Java程序猿JavaScript学习笔记(2——复制和继承财产)

    计划和完成在这个例子中,音符的以下序列: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaSc ...

  7. Java程序猿的JavaScript学习笔记(3——this/call/apply)

    计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...

  8. Java程序猿JavaScript学习笔记(4——关闭/getter/setter)

    计划和完成这个例子中,音符的顺序如下: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScr ...

  9. Java程序猿JavaScript学习笔记(14——扩大jQuery UI)

    计划和完成这个例子中,音符的顺序如下: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScr ...

随机推荐

  1. ViewPager导航栏TabLayout

    ViewPager中加入TabLayout导航 需要导入依赖包:  'com.android.support:appcompat-v7:xxxxx' compile 'com.android.supp ...

  2. npm安装完bower,使用时提示bower不是内部或外部命令

    归根结底还是环境变量的问题,但是配了好几次没配成功,最后就直接把装好的node里面的复制到系统创建的环境变量目录下,问题解决! 问题描述:我们安装node.js,npm,通过npm安装bower一路正 ...

  3. Android中处理崩溃异常CrashHandler

    来源:http://blog.csdn.net/liuhe688/article/details/6584143 大家都知道,现在安装Android系统的手机版本和设备千差万别,在模拟器上运行良好的程 ...

  4. windows无法安装到这个磁盘怎样解决

    装操作系统,出提示:windows无法安装到这个磁盘.这台计算机的硬件可能不支持启动到此盘.你甚至用专业的分区软件都无法解决这个问题,比如说PM等.一般在更换好新的硬盘的时候或者将操作系统装入移动硬盘 ...

  5. Timer和DPC

    一般两种方法使用/设置定时器,一种是使用I/O定时器例程,一种是使用DPC例程.1.定时器的实现1)使用I/O定时器例程NTSTATUSIoInitializeTimer(IN PDEVICE_OBJ ...

  6. Get it,你离几何达人不远了!

    对于爱学几何的人,是否存在这样的困扰:没有标准的尺规工具,图形画的不标准,理解上总是出错......整天在纸上画图,浪费大把大把的时间......几何图形画的不美观,在别人面前都拿不出手,公开课上都没 ...

  7. linux如何查看系统占用磁盘空间最大的文件及让文件按大小排序

    [root@localhost web_bak]  find / -type f -size +10G在Linux下如何让文件让按大小单位为M,G等易读格式,S size大小排序. [root@loc ...

  8. 将代码托管到OSChina服务器上

    前言:前面的文章已经介绍过了如何将代码托管到github的服务器.并且笔者也详细的介绍了使用HTTPS和SSH两种不同的身份验证方式.但是仅仅介绍github的使用是不够的,原因笔者已经在前面的文章中 ...

  9. 源代码管理工具(上)-SVN基本使用

    ------------------------------------------------------SVN简介和搭建 ------------------------------------- ...

  10. Hadoop实战第一篇

    前言:  都说现在是草根为尊的时代,近年来hadoop及spark技术在国内越来越流行.而且渐渐现成为企业的新宠.在DT时代全面来临之前,能提早接触大数据的技术必然能先人一步.本文作为Hadoop系列 ...