JavaScript学习笔记(1)

1. 在HTML中编写JavaScript脚本代码:

       1)script元素可以在文档中包含一段JavaScript脚本代码。并且该元素可以在HTML中出现任意次,可以位于head元素中,也可以位于body元素中。

       script元素的语法格式:

       <script  defer=”defer” type=”内容类型”  language=”语言标识符” src=”文档的URL地址” charset=”字符集”>

              客户端JavaScript脚本代码

       </script>

      

       defer=”defer”: 该属性通知浏览器,这段脚本不会产生任何文档内容,例如javascript代码document.write方法不会起作用。浏览器遇到这样代码将会忽略掉,并继续执行后面代码。属性值只能是defer,与属性名相同。也允许不定义属性值,而不使用属性名。

<script  defer type=”text/javascript” >

              客户端JavaScript脚本代码

       </script>

 

type=”内容类型” :指定元素内容使用的脚本语言,属性值是W3C标准定义的内容类型,例如text/tcl、text/javascript、text/vbscript。没有默认值,如果使用JavaScript就必须指定属性type为text/javascript。如上例

 

language=”语言标识符” :指定元素内容使用的脚本语言,它的值是这个语言的标识符,并且可以指定语言的版本,例如:

<script  defer type=”text/javascript” language=”javascript1.5”>

              客户端JavaScript脚本代码

</script>

大多数情况下不需要指定版本号

 

src=”文档的URL地址” :保存了脚本代码的外部文件的位置,如下代码:

<script  defer type=”text/javascript” language=”javascript1.5” src=”../myFunc.js”>

         客户端JavaScript脚本代码

</script>

脚本被保存到myFunc.js文件中,然后被引入到当前文档。

注意:脚本可以在script元素中,也可以在外部文件中,如果src属性设定了url值,用户浏览器必须从文件中加载脚本,忽略script元素中的内容。没有被设定url值,则必须把元素内容作为脚本来解释。

大多数情况下都不使用元素内部的脚本。如:

<script  defer type=”text/javascript” src=”../myFunc.js”></script>


charset=”字符集”:用于指定src属性指定的外部脚本代码所使用的字符编码,而不是script元素内的脚本代码。

 

2) 第二种定义方式:

将脚本代码定义在事件属性值中,事件包括的属性如下:

οnlοad=”script” 浏览器完成页面或所有的框架集后触发,在body和frameset中都可以使用

       οnunlοad=”script”浏览器从一个视窗或一个框架集中删除一个文档时出发,在body和frameset中使用

       οnclick=”script”定位设备(鼠标等)在一个元素上单击是触发

       ondbclick=”script”定位设备(鼠标等)在一个元素上双击是触发

       οnmοusedοwn=”script”定位设备(鼠标等)在一个元素上按下时触发

οnmοuseup=”script”定位设备(鼠标等)在一个元素上释放时触发

       οnmοuseοver=”script”定位设备(鼠标等)在一个元素上划过时触发

       οnmοusemοve=”script” 定位设备(鼠标等)在一个元素上移动时触发

       οnmοuseοut=”script”定位设备(鼠标等)在一个元素上移出时触发

       οnfοcus=”script”一个元素获取焦点时触发

       οnblur=”script”失去焦点时触发

       οnkeypress=”script”一个按元素上按键,并放开时触发

       οnkeydοwn=”script”一个键在一个元素上按下时触发

       οnkeyup=”script”一个键在一个元素上弹起是触发

       οnsubmit=”script”提交一个表单时触发

       οnreset=”script”重置一个表单时触发

       οnselect=”script”文本框中选择了文本时触发

       οnchange=”script”控件失去焦点,并且内容被修改的情况下就触发

 

       这些内建事件都可以触发一个脚本,无论何时只要事件被触发,这个脚本就会被执行,脚本的语法要看具体的使用的是什么脚本语言而定。

      

       例如userName是一个必须输入文本的的文本框,用户不行在这个文本框中输入数据时,onblur事件调用一个JavaScirpt函数确定userName中内容是否是一个可被接受的值。

       <inputname=”userName” οnblur=”javascript:validUserName(this.value)”>

      

       使用JavaScript的例子:

       <inputname=”num” οnchange=”javascript: if(!checkNum(this.value, 1, 10))

{this.focus(); this.select();} else {thanks()}” value=”0”>

 

2. 使用noscript元素:

       noscript元素允许创作者在脚本无法运行时,提供其他的内容。Noscript元素的内容只能在可以被识别脚本的用户浏览器上被浏览器渲染,仅能在如下情况下渲染:

       用户浏览器被设置为不能执行脚本

       Script元素出现在一个文件较前部分,用户浏览器不支持这个script元素调用的脚本语言。

      

       例如:

       <scripttype=”text/javascript”>

              客户端脚本代码

       </script>

       <noscript>

              <p>浏览器不支持javascirpt脚本,请访问<a href=”http://www.baidu.com”>这个网页</a>

       </noscript>

      

3. 注意事项:

       默认脚本语言,使用meta元素声明,如:

       <metahttp-equiv=”Content-Script-Type” content=”type”>

       Type值则为text/tcl、text/javascript、text/vbscript等值

 

       在内建事件中定义的JavaScript脚本,必须使用“javascript:”前缀。

      

       如下例子,默认的脚本语言声明为text/tcl, 文档中包含了两个script元素:一个位于头部,使用vbscript脚本,另一个位于body部分,使用javascirpt脚本:

       <!doctypehtml public “-//w3c//dtdhtml 4.01 // en” “http://www.w3.org/tr/html4/strict.dtd”>

       <html>

              <head>

                     <title>包含了多种脚本语言代码</title>

                     <metahttp-equiv=”content-script-type” content=”text/tcl”>

                     <scripttype = “text/vbscript” scr=”http://someplace.com/progs/vbcalc”></script>

              </head>

              <body>

                     <scripttype=”text/javascript”>

                            客户端JavaScript脚本代码

                     </script>

              </body>

       </html>

      

4. 在脚本中引用HTML元素:

       JavaScript可以引用HTML文档中的HTML元素,根据HTML元素分配的名称指向元素。元素的ID属性和name属性都可以表示该元素,因此通过两者都可以引用元素。

       在Javascript脚本代码中,不能出现”</”,因为HTML依靠<></>开始标签和结束标签来识别脚本代码。一旦出现上述的符号,将会解析错误。

 

5. JavaScript中的注释:

       JavaScript中的注释方法灵活,可以使用双斜线<//>或者使用斜线加星号的方式</* */>与C语言的注释类似。

       也可以使用HTML的注释方式,例如:<!--  注释 -->。注意<! 和 –中间不能有空格,否则解释错误。

       

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值