JS --简介

时间  2019-11-06
标签 简介 栏目 JavaScript 繁體版
原文   原文链接

JS是一种脚本语言
javascript

1.JS实现HTML输出
html

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html" charset="utf-8">
    <title> This is my HTML</title>
</head>
<body>
    <script type="text/javascript">
    document.write("JS实现HTML输出");
    </script>
</body>
</html>

2.JS实现对事件做出反应
java

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html" charset="utf-8">
    <title> This is my HTML</title>
</head>
<body>
    <button type="button" onclick="alert('点击了按钮')">按钮</button>
</body>
</html>

3.JS改变HTML内容
测试

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html" charset="utf-8">
    <title> This is my HTML</title>
</head>
<body>
    <p id="changeContent">本来输出的内容</p>
    <script type="text/javascript">
    function changeHTMLContent()
    {
        //找到元素(很明显，本例子的元素是p)
        x=document.getElementById("changeContent");
        //改变的内容
        x.innerHTML="这是替换的内容";
        //改变颜色
        x.style.color = "#00ff00";
    }
    </script>
    <button type="button" onclick="changeHTMLContent()">按钮</button>
</body>
</html>

4.JS验证输入
ui

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html" charset="utf-8">
    <title> This is my HTML</title>
</head>
<body>
    <p>验证输入的是否为数字，若是不为数字，弹出提示框提示</p>
    <input id="test" type="text">
    <script type="text/javascript">
    function check()
    {
        var x = document.getElementById("test").value;
        if (x == "" || isNaN(x)) 
            {
                alert("请输入数字");
            };
    }
    </script>
    <button type="button" onclick="check()">点击测试</button>
</body>
</html>
相关文章
相关标签/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公众号
   欢迎关注本站公众号,获取更多信息
联系我们 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程