区分：

JavaScript和JAVA一点关系没有，是一门单独的语言。（浏览器就是JavaScript的解释器）

JavaScript代码存在形式：

#这些代码一般都是在<head></head>里边写的

第一种是直接放在head里边

<head>

<style>CSS代码</style>

<script>JavaScript代码</script>

</head>

第二种是利用脚本引入的方式
<head>

<script src="*.js">JavaScript代码</script>

</head>

网页解释器的代码是从上向下进行，如果要把<script>的代码写到<head>上面，有可能出现地址访问不到网页一直转圈的情况，所以我们可以先让代码先执行完，再执行scipt代码。

也就是将<script>放在<body></body>里边的最后。

同理，<style>也一样

单行注释：//

多行注释：/*   */

JavaScript基础：

　　基本数据类型：

数字

字符串

列表

字典

布尔类型

条件语句

for循环（学语言一般要按照这个顺序写）

全局变量：

　　name=“alex”

局部变量：

　　var name="alex"

#声明变量一定要注意全局变量和局部变量的区别。

数字：

age=18;//表示创建了一个数字

<再写JavaScript代码的时候，可以在浏览器的终端写F12（console）>

字符串：

        a="alex";

        //取字符串

        a.charAt(1)

        //切片，取第几个到i-1的字符串

        a.substring(1,4)

        //字符串的长度

        a.length

创建一个定时器

        //setInterval("执行的操作",多少毫秒)

        setInterval("alert(123);",5000)

        或者setInterval("f1()",5000)

document.getElementById("li")

        <div id="l1">欢迎老男孩莅临指导</div>

        <script>

        document.getElementById("li");   #根据ID来判断是哪个标签

        tag=document.getElementById("li");

        tag.innerText                    #看标签里面的文本

        </script>

        #跑马灯小练习

            <script>

            function func(){

                //根据ID获取指定标签的内容

                var tag=document.getElementById("l1");

                //获取标签内部的内容

                var content = tag.innerText;

                var f = content.charAT(0);

                var l = content.substring(l,content.length);

                var new_content = l + f ;

                tag.innerText=new_content;

            }

            setInterval("func()",1000);

            </script>

            <div id="l1">欢迎老男孩莅临指导</div>

布尔类型：

        小写的false或true

数组：（列表）a=[11,22,33]

        obj.splice(起始位置，删除个数，插入什么数据)    插入，删除，或替换数字的元素

        obj.slice() 切片

        obj.join("分隔符")  在js中是列表的方法

        obj.concat(value)   拼接

字典：

        a={'k1':'v1','k2':'v2'};

for循环：

    第一种方式：循环时循环的是索引

        a=[11,22,33,44]

        for(var item in a ){

            console.log(a[item]);

        }

        #这里输出的是列表的索引

    第二种方式：

        for(var i=0;i<10;i++){

        }

        eg:

        a=[11,22,33,44]

        for(var i=0;i<a.length;i=i+1){

            console.log(a[item]);

        }

        //不支持字典的循环

条件语句：

        if(条件){}

        else if(条件){}

        else{}

        ==值相等

        ===值和类型都相等

        &&  and

        ||  or

JavaScript函数：

函数：

        function 函数名(a,b,c){

            执行代码

        }

Dom选择器：

1，如何去找到标签

Dom直接选择器：

        1，找到标签

            #获取单个元素

            document.getElementById('id')

            整个html的id不可重复

            #获取多个元素

            document.getElementByTagName("div")

            或者

            document.getElementByClassName('class')

Dom间接选择器：

        也就是说先找到一个标签，然后去找他的上级，下级，父级等标签

        tag = document.getElementById('id')

        parentElement           // 父节点标签元素

        children                // 所有子标签

        firstElementChild       // 第一个子标签元素

        lastElementChild        // 最后一个子标签元素

        nextElementtSibling     // 下一个兄弟标签元素

        previousElementSibling  // 上一个兄弟标签元素

        可以利用tag.方法来使用

2，操作标签

        标签.innerText=""           #对标签内的元素重新赋值

        标签.className=""            #改掉class的值

        标签.classList.add=""        #添加指定样式

        标签.classList.remove=""    #删除指定样式

实现一个菜单切换的小例子模型：
　　

<div onclick='func()'>点我</div>

    <script>

        function func(){

        }

    </script>

Day14 JavaScript的更多相关文章

  1. Day14 Javascript 点击添加出弹窗，取消隐藏弹窗小练习 反选，全选，取消边框

    点击添加出弹窗,取消隐藏弹窗小练习 代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta ...

  2. 【目录】Python自动化运维

    目录:Python自动化运维笔记 Python自动化运维 - day2 - 数据类型 Python自动化运维 - day3 - 函数part1 Python自动化运维 - day4 - 函数Part2 ...

  3. 前端基础之JavaScript - day14

    写在前面 上课第14天,打卡: 唯心不易,坚持! 参考:http://www.cnblogs.com/yuanchenqi/articles/6893904.html 前言 一个完整的 JavaScr ...

  4. Python之路,Day14 - It's time for Django

    Python之路,Day14 - It's time for Django   本节内容 Django流程介绍 Django url Django view Django models Django ...

  5. Python学习笔记整理总结【web基础】【web/HTML/CSS/JavaScript/DOM/jQuery】

    一.HTML HTML是英文Hyper Text Mark-up Language(超文本标记语言)的缩写,他是一种制作万维网页面标准语言(标记).相当于定义统一的一套规则,大家都来遵守他,这样就可以 ...

  6. python开发学习-day14(jquery、ajax等)

    s12-20160421-day14 *:first-child { margin-top: 0 !important; } body>*:last-child { margin-bottom: ...

  7. day14(编码实战-用户登录注册)

    day14 案例:用户注册登录 要求:3层框架,使用验证码   功能分析 注册 登录   1.1 JSP页面 regist.jsp 注册表单:用户输入注册信息: 回显错误信息:当注册失败时,显示错误信 ...

  8. JavaScript之父Brendan Eich，Clojure 创建者Rich Hickey，Python创建者Van Rossum等编程大牛对程序员的职业建议

    软件开发是现时很火的职业.据美国劳动局发布的一项统计数据显示,从2014年至2024年,美国就业市场对开发人员的需求量将增长17%,而这个增长率比起所有职业的平均需求量高出了7%.很多人年轻人会选择编 ...

  9. javascript中的Array对象 —— 数组的合并、转换、迭代、排序、堆栈

    Array 是javascript中经常用到的数据类型.javascript 的数组其他语言中数组的最大的区别是其每个数组项都可以保存任何类型的数据.本文主要讨论javascript中数组的声明.转换 ...

随机推荐

  1. android PakageManagerService启动流程分析

    PakageManagerService的启动流程图 1.PakageManagerService概述 PakageManagerService是android系统中一个核心的服务,它负责系统中Pac ...

  2. Mybatis简单入门

    MyBatis是一个支持普通SQL查询,存储过程和高级映射的优秀持久层框架.MyBatis消除了几乎所有的JDBC代码和参数的手工设置以及对结果集的检索封装.MyBatis可以使用简单的XML或注解用 ...

  3. Android进阶(十三)网络爬虫&json应用

    刚开始接触网络爬虫,怎一个"菜"字了得!经过几次的折磨,对其原理以及其中用到的json技术有了大致的了解,故作一总结,供有同样迷惑的朋友参考学习. 自己爬取的网站内容为12306的 ...

  4. 【一天一道LeetCode】#106. Construct Binary Tree from Inorder and Postorder Traversall

    一天一道LeetCode 本系列文章已全部上传至我的github,地址:ZeeCoder's Github 欢迎大家关注我的新浪微博,我的新浪微博 欢迎转载,转载请注明出处 (一)题目 来源:http ...

  5. 《java入门第一季》之根据小案例体会泛型

    泛型在哪些地方使用呢? * 看API,如果类,接口,抽象类后面跟的有<E>就说要使用泛型.一般来说就是在集合中使用. 下面根据案例,加深体会泛型的作用. 案例一: import java. ...

  6. python复杂网络库networkx：基础

    http://blog.csdn.net/pipisorry/article/details/49839251 其它复杂网络绘图库 [SNAP for python] [ArcGIS,Python,网 ...

  7. 【一天一道LeetCode】#95. Unique Binary Search Trees II

    一天一道LeetCode 本系列文章已全部上传至我的github,地址:ZeeCoder's Github 欢迎大家关注我的新浪微博,我的新浪微博 欢迎转载,转载请注明出处 (一)题目 Given a ...

  8. android开发技巧——仿新版QQ锁屏下弹窗

    新版的qq,可以在锁屏下弹窗显示qq消息,正好目前在做的项目也需要这一功能.经过各种试验和资料查找,终于实现,过程不难,但是却有一些地方需要注意. 下面是实现过程. 1.使用Activity,而不是V ...

  9. (NO.00001)iOS游戏SpeedBoy Lite成形记(二十六)

    到目前为止,选手跑到终点时仿佛没什么激动人心的事情发生呢?貌似需要添加一些胜利的特效啊! 前面说好的不添加特效,只完成游戏功能的诺言呢? T T 我们主要想实现这样一个特效效果: 1.胜利的玩家突出显 ...

  10. 从模板模式到JdbcTemplate

    模板模式初探 关于模板模式,大家可以参阅 模板方法模式深度解析(一) 原始的jdbc 关于原始的jdbc,如下: import java.sql.Connection; import java.sql ...