• JavaScript 初步认识


    首先呢 要成为WEB全栈工程师呢 JavaScript 是必须要会的 高级技术看自身兴趣爱好,但是基础必须掌握 因为有良好的基础学习jQuery会比较轻松。

    js是一门轻量的脚本语言 我学它主要目的是针对HTML页面的响应。


     1 JS在什么地方写?

    JS可以在HTML中的head标签内出现,也可以在body标签中出现,或是在body标签下面写,你也可以把它放在一个后缀为 .js 的文件中。最常见的是在body标签后 和 生成js文件后引入。

    1.1 在body后面写js

    <!DOCTYPE html>
    <html>
    <head>
        <title>learn javascript</title>
    </head>
    <body>
    
    </body>
    {{--js--}}
    <script>
        alert("yo man what's up");
    </script>
    </html>

    1.2 外部引入

    新生成一个js文件 在它的内部写你想写的js代码(这里我们就简单写写):

    alert("yo man what's up");

    然后在页面中引用:

    <!DOCTYPE html>
    <html>
    <head>
        <title>learn javascript</title>
    </head>
    <body>
    
    </body>
    {{--js--}}
    <script src="demo.js"></script>
    </html>

    2 输出功能

     js常用的输出数据的方法有四种:

    1. document.write:写入HTML文档中。
    2. window.alert:弹出一个警告窗口。
    3. console.log:写入到浏览器控制台中。
    4. innerHTML:写入到HTML元素中。

    2.1 写入HTML文档

    <script>
        document.write("<h1>hohoho</h1>");
        document.write(Date())
    </script>

    这仅仅是往HTML中写入内容,但是如果在页面已经加载完毕了在执行write的话 页面就会被覆盖。

    2.2 警告窗

    我们可以通过警告窗向用户展示错误信息或是别的,在开发中也可用于测试。

    <script>
        window.alert("alert");
        alert(1 + 1);
    </script>

    2.3 写入浏览器控制台

    <script>
        var number = 5 + 6;
        console.log("write to console:" + number)
    </script>

    这样我们就可以打开浏览器 在开发者工具中的console控制台看见这段话了。很合适调试测试时使用。

    2.4 写入HTML元素

    这是最常用的方法了,它可以改变HTML中元素的内容。

    <!DOCTYPE html>
    <html>
    <head>
        <title>learn javascript</title>
    </head>
    <body>
    <p id="demo" onclick="showDate()">现在几点?</p>
    </body>
    {{--js--}}
    <script>
        function showDate(){
            // 首先通过ID来查找元素 然后用innerHTML来修改内容。
            document.getElementById("demo").innerHTML = Date();
        }
    </script>
    </html>
  • 相关阅读:
    MySQL命令 导出 数据和结构
    Maven web 项目工程的建立
    Maven的配置以及Eclipse的设置
    项目管理工具Maven的安装
    centos7 安装 redis
    Java + 腾讯邮箱 SSL加密问题 重要通知
    centos7 上配置Javaweb---MySQL的安装与配置、乱码解决
    关于阿里云Centos服务器搭建Java网站不能访问的问题
    浏览器使用经验
    Linux常用命令大全
  • 原文地址:https://www.cnblogs.com/sun-kang/p/7469185.html
Copyright © 2020-2023  润新知