zoukankan      html  css  js  c++  java
  • 如何在文件中添加脚本和引用js

    摘要:如何在HTML文件中添加JavaScript代码,引用独立JS文件,和JS变量声明、变量类型,如何对它们进行赋值、改变、计算等一系列操作,掌握不同运算符的使用方法,灵活运用算术运算符、比较运算符、逻辑运算符对变量和数值进行操作。

    Web前端开发师需要掌握什么技术?也许你已经了解HTML标记(也称为结构),知道了CSS样式(也称为表示),会使用HTML+CSS创建一个漂亮的页面,但这还不够,它只是静态页面而已。我们还需使用JavaScript增加行为,为网页添加动态效果。

    JavaScript能做什么?

    • 增强页面动态效果(如:下拉菜单、图片轮播、信息滚动等)
    • 实现页面与用户之间的实时、动态交互(如:用户注册、登陆验证等)

    JS进阶篇学习什么

    在JavaScript入门篇中,我们学习了如何插入JS、输出内容及简单的DOM操作,JavaScript进阶篇进一步的了解JS的变量、数组、函数、语法、对象、事件、DOM操作,制作简单的网页动态效果。

    在网页中插入JS代码,实现输出"JS进阶篇",并弹出对话框,内容为"关注JS高级篇"。

     1     <!DOCTYPE html>
     2     <html>
     3         <head>
     4             <meta charset="utf-8">
     5             <title></title>
     6             <script type="text/javascript">
     7                 document.write('js进阶篇');
     8                 alert('关注JS高级篇')
     9             </script>
    10         </head>
    11         <body>
    12         </body>
    13     </html>

    测试在html页面中的插入JavaScript脚本,打开页面时,在页面中显示一句话 : "系好安全带,准备启航--目标JS",并弹出一个提示框:"准备好了,起航吧!"相关要求:

    • 第一步:把注释语句注释。
    • 第二步:编写代码,在页面中显示 “系好安全带,准备启航--目标JS”文字;
    • 第三步:编写代码,在页面中弹出提示框“准备好了,起航吧!”(提示: 可以把弹框方法写在函数里。)
    • 第四步:使用引入JS外部文件的方式实现以上的任务
     1 <!DOCTYPE html>
     2 <html>
     3     <head>
     4         <meta charset="utf-8" />
     5         <title></title>
     6         <!--引入外部文件的方式-->
     7         <script src="" type="text/javascript"></script>
     8         <script type="text/javascript">
     9         //单行注释
    10         /*
    11         我是多行注释!
    12         我需要隐藏,
    13         否则会报错哦!
    14         */
    15         //在页面中显示文字
    16         document.write('开始学习JS基础语法');
    17         //页面中弹出提示框
    18         alert('准备好了,起航吧!');
    19         </script>
    20     </head>
    21     <body>
    22     </body>
    23 </html>
  • 相关阅读:
    IE 中的 button type默认值问题
    linux中的&&和&,|和||
    scp 上传 下载 文件
    git 撤销,放弃本地修改
    git branch 新建,推送与删除
    git tags 管理
    CentOS7下Firewall常用命令
    git 忽略文件,不提交文件 清空缓存
    mysql 常用命令
    优秀的测试人员简历是什么样子的?
  • 原文地址:https://www.cnblogs.com/webaction/p/12690806.html
Copyright © 2011-2022 走看看