JavaScript学习笔记——基本知识
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学习笔记——基本知识的更多相关文章
- jQuery学习笔记 - 基础知识扫盲入门篇
jQuery学习笔记 - 基础知识扫盲入门篇 2013-06-16 18:42 by 全新时代, 11 阅读, 0 评论, 收藏, 编辑 1.为什么要使用jQuery? 提供了强大的功能函数解决浏览器 ...
- JavaScript:学习笔记(8)——对象扩展运算符
JavaScript:学习笔记(8)——扩展运算符 对象的扩展运算符 扩展运算符是三个点(...).用于取出参数对象的所有可遍历属性,然后拷贝到当前对象之中. 如上图所示,新建了一个对象a,然后通过扩 ...
- JavaScript:学习笔记(5)——箭头函数=>以及实践
JavaScript:学习笔记(5)——箭头函数=>以及实践 ES6标准新增了一种新的函数:Arrow Function(箭头函数).本文参考的链接如下: MDN箭头函数:https://dev ...
- Java程序猿的JavaScript学习笔记(汇总文件夹)
最终完结了,历时半个月. 内容包含: JavaScript面向对象特性分析,JavaScript高手必经之路. jQuery源代码级解析. jQuery EasyUI源代码级解析. Java程序猿的J ...
- Java程序猿的JavaScript学习笔记(8——jQuery选择器)
计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...
- Java程序猿JavaScript学习笔记(2——复制和继承财产)
计划和完成在这个例子中,音符的以下序列: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaSc ...
- Java程序猿的JavaScript学习笔记(3——this/call/apply)
计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...
- Java程序猿JavaScript学习笔记(4——关闭/getter/setter)
计划和完成这个例子中,音符的顺序如下: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScr ...
- Java程序猿JavaScript学习笔记(14——扩大jQuery UI)
计划和完成这个例子中,音符的顺序如下: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScr ...
随机推荐
- Beta项目冲刺 --第一天
新的开始.. 队伍:F4 成员:031302301 毕容甲 031302302 蔡逸轩 031302430 肖阳 031302418 黄彦宁 会议内容: 1.站立式会议照片: 2.项目燃尽图 3.冲刺 ...
- Maven的set.xml标签详解
文件存放位置 全局配置: ${M2_HOME}/conf/settings.xml 用户配置: ${user.home}/.m2/settings.xml note:用户配置优先于全局配置.${use ...
- jQuery基础--样式篇(4)
jQuery选择器: 1.id选择器:通过id名来获取节点,id是唯一的,每个id在页面上只能使用一次. $( "#id" ) 2.类选择器:通过class样式类名来获取节点 $( ...
- 【CodeVS 5032】【省队集训2016 Day5 T1】Play with array
一开始我用分块大法,分成$\sqrt{n}$块,每个块上维护一个Splay,然后balabala维护一下,时间复杂度是$O(n\sqrt{n}logn)$.后来对拍的时候发现比$O(n^2)$的暴力跑 ...
- 一个最简单的ftpsever
没有什么事情可以做,无聊的很 写个最简单的ftp吧---说白了就是一个简单的文件上传.QAQ 思路:client --读取文件的一行 然后发到server端 然后server 读取 写入文件的一行 先 ...
- Python 字符串操作
Python 字符串操作(string替换.删除.截取.复制.连接.比较.查找.包含.大小写转换.分割等) 去空格及特殊符号 s.strip() .lstrip() .rstrip(',') 复制字符 ...
- 自动完成--autoComplete插件(2)
远端的也可以成为本地的数据 4) lookupLimit 类型:数字 说明:本地数据显示的最大条数,服务器段的没有效果,服务器端的可以后台设置 默认:没有限制 5) lookupFilter 类型: ...
- win10 1607 密匙
win10 1607 安装密钥 GVLK Core=YTMG3-N6DKC-DKB77-7M9GH-8HVX7 Professional=VK7JG-NPHTM-C97JM-9MPGT-3V66T E ...
- PHPCMS \phpsso_server\phpcms\modules\phpsso\index.php、\api\get_menu.php Authkey Leakage
catalog . 漏洞描述 . 漏洞触发条件 . 漏洞影响范围 . 漏洞代码分析 . 防御方法 . 攻防思考 1. 漏洞描述 安装phpcms的时候会强制安装它的通行证 Relevant Link: ...
- Flipping Bits in Memory Without Accessing Them: An Experimental Study of DRAM Disturbance Errors
目录 . Rowhammer Introduction . Rowhammer Principle . Track And Fix 1. rowhammer introduction 今天的DRAM ...