1、javascript是什么


根据用户的一些操作,然后来修改页面上的一些元素、属性等。

(1)HTML+CSS静态页面,JS给页面添加动的效果

(2)网页特效的原理

javascript就是修改样式

(3)编写JS的流程:

【1】布局:HTML+CSS

【2】属性:确定要修改哪些属性

【3】事件:确定用户做哪些操作

【4】编写JS:在事件中,用JS来修改页面元素的样式

补:事件:就是用户操作,如鼠标点击、移入、移出等

(4)id:在css中,id作为css里的一个选择符存在,而在JS里它有更加广泛的用途,

在JS中扮演标签(元素)名字的作用,如<div id="div1">......</div>,id在这个例子里扮演了div名字的作用,div1就是div的名字

(5)div1.style.display='block'

点 .      ------> 的,一般来说是所属的关系,其实是属性

等号 = ------> 在数学里,x=5,表示x的值就是5,即等号就是相等的意思

在JS里,等号并不是相等的意思,等号指赋值,把什么变成什么,把=右边的值赋给左边

2、第一个JS兼容性问题:document.getElementById


(1)在FF和低版本的chrome下,是不能直接拿着id就用的,存在兼容问题

真正兼容的写法是document.getElementById('id名字'),在任何浏览器下均可用

如:document.getElementById('div1');

通过div1这个id把元素获取出来,然后再来用

注:记住,不能直接拿着id就用,而必须的通过getElementById(把元素获取出来)获取一下,然后才可以用

(2)网页换肤

(1) 任何标签都可以加ID,包括link

(2) 任何标签的任何属性,也都可以修改

(3) HTML里怎么写,JS里就怎么写,只有一个例外就是class,因为class在JS里是关键字(保留字),所以不能直接拿来用,要写成className

3、引入函数:因为直接在事件内写代码会很乱

(1)函数基本格式:

 function 函数名(){代码}

JS里的函数和css里的class有点相似,像class它最大的一个功能就是你把这个样式写到class里边,然后只要需要这套样式的地方,直接把那个class拿过去用就

可以了,同样JS里的函数也一样.

(2)函数的定义和调用

     function show()        //定义{alert('abc');}show();               //调用

函数定义:只是告诉系统有这个函数,不会实际执行

函数调用:真正执行函数里的代码

注:函数的定义和调用缺一不可,只有定义则没反应,只有调用则显示出错了

(3)引入变量的概念:考虑到重用

变量:就是给东西取了个别名

如var oDiv=document.getElementById('div1');给后面这大串取了个别名叫oDiv。看到oDiv就跟看到document.getElementById('div1')是一样的效果

注:(1) 如果你要操作一个元素,你必须先把它选择过来,比如现在要操作的是text这个元素,那么需要先给它加个id,比如id="txt1",然后function函数里用

getElementById把它给选择过来

(2) 要操作谁,就要获取谁

(3) 需要一个函数,这个函数是为按钮准备的,因为它点击需要一个函数

4、if判断:如点击按钮显示/隐藏div(弹出菜单)

(1)if判断基本格式:

if(条件)
{
语句1
}
else
{
语句2
}

翻译:如果条件成立就执行语句1,如果条件不成立就执行语句2

 注:(1) if :如果

(2) 条件:在IS里是判断的意思,就是遇到不同的情况就做不同的操作,遇到不同的问题就做不同的处理

(2)单等和双等(=和==)

=    赋值(改变,变成)

==   判断(判断两边是否相等)

(3)为a链接添加JS

<!--<a href="javascript:alert('a');">链接</a> -->

<a href="javascript:;">链接</a>

一般a里不加JS代码,而是空的js原因:(1) 在a里加js代码不好 (2) 加空的js代码而不是加#,因为它不会像#那样一点就跳到页首。

一、初探Javascript魅力(1)_看智能社blue老师JS视频整理的笔记相关推荐

  1. 三、深入Javascript(1)_看智能社blue老师JS视频整理的笔记

    1.函数返回值 ( return ) function show() {return 12; }; alert(show()); //弹出12 (1)return就是函数返回值,作用把东西返回到函数外 ...

  2. B站JavaScript从入门到精通智能社Blue石川老师视频部分代码_轮播图

    从三月底开始,慢慢地上手了JavaScript,去年在学校放假前也看了一套视频,总感觉好像是会了又好像不会,现在看了Blue老师的视频,感觉思路清晰多了,也终于算是入门了吧. 接下来我会把学习过程中跟 ...

  3. B站JavaScript从入门到精通智能社Blue石川老师视频部分代码_幻灯片

    <!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8" ...

  4. 【JavaScript从入门到精通】第一课 初探JavaScript魅力-01

    第一课 初探JavaScript魅力-01 JavaScript是什么 如今我们打开一个大型的网站,都会有很多JS效果的功能和应用.对于学过CSS+HTML的同学,即使是像淘宝那样的网站,用一两天时间 ...

  5. 【JavaScript从入门到精通】第二课 初探JavaScript魅力-02

    第二课 初探JavaScript魅力-02 变量 说起变量,我们不得不提起我们有一部比较古老的电视剧叫<包青天>.包青天有一把非常厉害的宝剑叫"尚方宝剑",见到尚方宝剑 ...

  6. 初探JavaScript魅力1

    JS前置知识 什么是JS语言 javascript是一种运行在***客户端*** 的***脚本语言*** 客户端:即接受服务的一端,与服务端相对应,在前端开发中,通常客户端指的就是浏览器. 脚本语言: ...

  7. 【JavaScript从入门到精通】第一课 初探JavaScript魅力-02

    变量 说起变量,我们不得不提起我们有一部比较古老的电视剧叫<包青天>.包青天有一把非常厉害的宝剑叫"尚方宝剑",见到尚方宝剑有如见到皇帝.某种程度来说,变量具有类似于尚 ...

  8. 2021年前端小白进阶大神必看编程资源免费分享(视频+源码+笔记)

    关注了我的同学都知道,我给大家分享资源,一般最先开始给大家的是 小白成长的学习线路图,先缕清思路,我们再开始学习 首先我们先看下前端应该从哪里开始学起,这是我在黑马程序员的论坛上找的一张学习线路图,可 ...

  9. 智能社JS学习笔记(一)

    前言 转眼工作即将半年,这段时间自学了UI,html和css方面能比较熟练的掌握了,写过两套小程序的模板但只知其然不知其所以然(还是因为自己js基础知识掌握的不够啊)用bootstrap之类的框架能写 ...

最新文章

  1. python学习笔记(7-11)
  2. java设计模式 订阅模式_Java中的复合设计模式
  3. beetl 取list下标的问题
  4. 从浪漫走向坚韧:开源数据库的演变
  5. 神奇的幻方(洛谷P2615题题解,Java语言描述)
  6. 数据库基础知识——参考数据库基本概念6版
  7. VMware在NAT模式下配置静态IP
  8. 回调函数 EnumFontFamProc
  9. 怎样用计算机进行文字采集,怎么将照片上的文字自动录入电脑
  10. 使用PhoneNumberValidator判断用户输入的电话格式,并用PhoneFormatter对电话号码格式化。...
  11. 再谈mysql之执行计划explain
  12. QPainter绘图基本使用
  13. 2022DIY电脑配置入门篇(包含各cpu显卡天梯图对比)
  14. 【OD矩阵】《城市公交IC卡·数据分析方法及应用》利用公交运营时间和乘客刷卡时间特征识别上车点
  15. 数据库原理及应用实验:数据库安全性控制
  16. 网络聊天室的分析与实现
  17. 利用Java实现将华氏温度转换为摄氏温度
  18. Hive distribute 问题
  19. 网易云音乐api,登录出现 网络太拥挤
  20. LintCode(M) 乱序字符串

热门文章

  1. 【Axure高保真原型】下拉分级选择器
  2. pyinstaller库属于python语言的标准库_Day6----Python的pyinstall库的使用
  3. 软件测试计划分哪五大块,[liu yanling]软件测试分为哪几个计划过程阶段
  4. Java——超市会员管理系统(JDBC+MySQL+Apache DBUtils)
  5. delete this
  6. 杰理的蓝牙芯片的key是什么?以及该如何添加key?杰理key文件原理
  7. Vue3+TS+Vite无法使用require导入图片的解决方法
  8. first-child、last-child、nth-child( )失效问题
  9. 实验八.方程根的MATLAB求解
  10. 8位单片机九齐NY8A054E