JavaScricp简介

JavaScript一种直译式脚本语言,是一种动态类型、弱类型、基于原型的语言,
    内置支持类型。它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言
组成部分:
    ECMAScript:js基础语法(规定 关键字 运算符 语句 函数等等...)
    BOM:浏览器对象模型
    DOM:文档对象模型
作用:
    修改html页面的内容
    修改html的样式
    完成表单的验证
注意:
    js可以在页面上直接写,也可以单独出去
    js的文件的后缀名 .js
js和html整合
    方式1:在页面上直接写
        将js代码放在 <script></script>标签中,一般放在head标签中
    方式2:独立的js文件
        通过script标签的src属性导入
js中变量声明:
    var 变量名=初始化值;
    var 变量名;
        变量名=初始化值;
    注意:
        var可以省略 建议不要省略
        一行要以分号结尾,最后一个分号可以省略,建议不要省略
js的数据类型:
    原始类型:(5种)
        Null
        String
        Number
        Boolean
        Undefined
        通过 typeof运算符可以判断一个值或者变量是否属于原始类型,若属于原始类型,他还可以判断出属于那种原始类型
            typeof 变量|值;
        若变量为null,使用typeof弹出的值 object

        使用typeof的返回值
            undefined - 如果变量是 Undefined 类型的 
            boolean - 如果变量是 Boolean 类型的 
            number - 如果变量是 Number 类型的 
            string - 如果变量是 String 类型的 
            object - 如果变量是一种引用类型或 Null 类型的 

    引用类型:
javascrtpt 实现窗口拖拽、移动功能、显示坐标代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html <head runat="server"> <title></title> [removed] var mouseX, mouseY; var objX, objY; var isDowm = false; //是否按下鼠标 function mouseDown(obj, e) { obj.style.cursor = "move"; objX = div1.style.left; objY = div1.style.top; mouseX = e.clientX; mouseY = e.clientY; isDowm = true; } function mouseMove(e) { var div = document.getElementById("div1"); var x = e.clientX; var y = e.clientY; if (isDowm) { div.style.left = parseInt(objX) + parseInt(x) - parseInt(mouseX) + "px"; div.style.top = parseInt(objY) + parseInt(y) - parseInt(mouseY) + "px"; document.getElementById("span1")[removed] = "x:" + div.style.top + " " + "y:" + div.style.left; } } function mouseUp(e) { if (isDowm) { var x = e.clientX; var y = e.clientY; var div = document.getElementById("div1"); div.style.left = (parseInt(x) - parseInt(mouseX) + parseInt(objX)) + "px"; div.style.top = (parseInt(y) - parseInt(mouseY) + parseInt(objY)) + "px"; document.getElementById("span2")[removed] = "x:" + div.style.top + " " + "y:" + div.style.left; mouseX = x; rewmouseY = y; div1.style.cursor = "default"; isDowm = false; } } [removed] </head> <body> <span id="span1"></span></br><span id="span2"></span></br> <div id="div1" Green; border: 1px solid red; height: 300px; top: 100px; left: 100px; width: 300px; position: absolute;" </div> </body> </html>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值