javascript 学习笔记(一)

  说明:从今天开始从基础抓起学习javascript-完全依据w3school(http://www.w3school.com.cn/js/js_intro.asp)网站顺序。这里我将我认为不好理解的地方积累下来,希望对像我一样的新手有益。

第一篇 JavaScript:写入 HTML 输出

   1. javascript有一种作用就是可以输出html文档:如图

  2. 然后理解html文档是如何输出的: 首先比较以下三种图片

   

 

  然后发现了什么,就一句话:html文档的输出是按顺序进行的,就和我们画画一样,边画边出效果,这就是HTML文档的加载机制。

3. 什么叫文档加载中和文档加载后?

    边写边出效果那个过程就是文档加载中;

      浏览器输出流关闭后便是文档加载后;

  (您只能在 HTML 输出流中使用 document.write。 如果您在文档已加载后使用它(比如在函数中),会覆盖整个文档)。刚开始没有搞懂,现在知道原来是这样的,在这里有两种情况:

 第一种:把document.write注册给事件window.onload.(注意:可以被我们注册内容);

  当我们所有的HTML文档加载完成后,浏览器的整个输出流就会自动关闭,然后默认触发这个事件,注意是输出流关闭后,才开始执行这个事件,所以如果你在这个事件中搞一个document.write(),(注意前面这句话的顺序)那么就会开始一个新的输出流,替换之前所有的HTML文档内容。如下图:

 第二种:把document.write写到一个函数中;

  如下图整个文档已经加载完成,但点击按钮执行函数后,又会开始一个新的输出流,其实这和window.onload是一样的额,只不过它是自动触发的。如下图

  

 

点击按钮后文档被替换。

 

转载于:https://www.cnblogs.com/popstar8866/p/5356767.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/490867.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

[附下载]英特尔中国研究院携手生态伙伴发布《机器人4.0白皮书》

来源:硬蛋迈向云-边-端融合的机器人4.0时代在2019国际人工智能与机器人创新生态峰会上,英特尔中国研究院院长宋继强博士发表了题为《迈向云-边-端融合的机器人4.0时代》的主题演讲。宋院长分析了机器人行业的现状与发展趋势,提出了基于AI、5G…

使用哈希表的好处

先来了解一下Hash的基本思路: 设要存储对象的个数为num, 那么我们就用len个内存单元来存储它们(len>num); 以每个对象ki的关键字为自变量,用一个函数h(ki)来映射出ki的内存地址,也就是ki的下标,将ki对象的元素内容全部存入这个…

MATLAB(二)数据的输入

数据的输入 (一)简单矩阵的输入 1.要直接输入矩阵时,矩阵一行中的元素用空格或逗号分隔;矩阵行与行之间用分号“;”隔离,整个矩阵放在“[ ]”里。 >> a [1, 2, 3, 4;5, 6, 7, 8] a 1 2 3 …

linux yum下载RPM包后再安装LAMP环境

1.下载yum插件 yum-downloadonly,实现只下载软件包的功能。 yum install yum-downloadonly 或者 yum install yum-plugin-downloadonly 2.用yum下载Apache,Mysql,PHP. 2.1 下载Apache yum install httpd httpd-devel --downloadonly --downloaddir/home/lamp 2.2 下…

无人驾驶产业的国际比较和PEST分析

来源:智造智库【导读】国家新一代人工智能发展规划中明确提出,发展自动驾驶汽车和轨道交通系统,加强车载感知、自动驾驶、车联网、物联网等技术集成和配套,开发交通智能感知系统,形成我国自主的自动驾驶平台技术体系和…

树回归的介绍

线性回归包含一些强大的方法,但这些方法创建的模型需要拟合所有的样本点(局部加权线性回归除外)。当数据拥有众多特征并且特征之间关系十分复杂时,构建全局模型的想法就显得太难了,也略显笨拙。而且,实际生…

python glob.glob() 函数

用于匹配文件路径,返回所有匹配的文件路径列表。 print (glob.glob(r"D:\*.png") 匹配符包括“*”、“?”和"[]",其中“*”表示匹配任意字符串,“?”匹配任意单个字符,[0-9]与[a-z]表示匹配0-9的单个数字…

[改善Java代码]若有必要,使用变长数组

Java中的数组是定长的,一旦经过初始化声明就不可改变长度,这在实际使用的时候非常不方便.比如要对一个班级的学生信息进行统计,因为我们不知道班级会有多少个学生(随时可能有退学,入学,转学),所以需要一个足够大的数组来容纳所有的学生.可以通过对数组扩容解决该问题. 代码如下…

人类正在进入超级智能时代,论一种新超级智能的崛起

本文发表在2019年7月30号《社会科学报》,是刘锋根据2019年7月出版的著作《崛起的超级智能:互联网大脑》核心内容撰写的一篇文章,也感谢刘慈欣,张亚勤,周鸿祎,王飞跃,约翰.翰兹等专家和好友推荐。…

python实现随机乱序/洗牌

import randomrandom.shuffle(a) # a是一个列表

有道翻译接口问题

博文更新: 更新地址:https://blog.csdn.net/qq_40962368/article/details/89053068 原博文: 在调用有道翻译api接口时,出现了如下错误: 您要翻译的内容是:english Traceback (most recent call last):F…

GE前董事长伊梅尔特谈数字化转型:制造企业这件事做不好,一定没出路

来源:《商业评论》2019年7月号;两位作者:GE前董事长兼CEO杰弗里伊梅尔特;GE第一位常驻教授维贾伊戈文达拉扬无论过去还是现在,企业要实现任何转型都不容易。制造企业想实施数字化转型?这比实施其他任何一种…

spirng mvc 中使用验证码

生成验证码方法&#xff1a; RequestMapping("/vCode")ResponseBodypublic Map<String, String> vCode(HttpServletRequest request,HttpServletResponse response){//设置不缓存图片response.setHeader("Pragma", "No-cache");response.s…

MATALB(三)绘图命令

绘图命令 &#xff08;一&#xff09;二维绘图命令 二维绘图的基本命令有plot&#xff0c;loglog&#xff0c;semilogx&#xff0c;semilogy和polar。它们的使用方法基本相同&#xff0c;其不同点是在不同的坐标中绘制图形。plot命令使用线性坐标空间绘制图形&#xff1b;loglo…

python assert函数

assert expression , arguments arguments可选&#xff0c;当expression为真时正常执行程序&#xff0c;当expression为假时执行arguments assert 11 # 条件为 true 正常执行 assert 12, 1 不等于 2 Traceback (most recent call last): File "<stdin>",…

微软打压竞争对手:针对AWS、谷歌、阿里云等提高软件许可成本

来源&#xff1a;云头条使用在公共云上托管的专用服务器上运行的微软软件&#xff1f;那就准备好多付钱。微软改变了许可条款&#xff0c;将使微软软件对AWS、谷歌云和阿里云的一些客户来说变得更昂贵。微软现在声称&#xff1a;专用托管云服务的出现使传统外包和云服务之间的界…

HTML文字横向滚动

<!DOCTYPE html><html><head> <title></title></head><body><div> <marquee width"100%" height"64px" direction"left" scrollamount"3" οnmοuseοver"this…

一维和二维卷积和池化

一维卷积的卷积核是二维的&#xff0c;二维卷积的卷积核是三维的&#xff08;因为卷积要考虑深度&#xff0c;即通道数&#xff09; 例如输入数据为(128,32,28,28)&#xff0c;128为batch size&#xff0c;32为channel&#xff0c;28和28是hight和width&#xff0c;如果采用二…

python+OpenCV图像处理(四)图像的简单几何变换

图像的简单几何变换 先看一下关于图像几何变换的简介&#xff1a; 几何变换不改变图像的像素值&#xff0c;只是在图像平面上进行像素的重新安排。 适当的几何变换可以最大程度地消除由于成像角度、透视关系乃至镜头自身原因所造成的几何失真所产生的负面影响。有利于我们在后续…

谷歌AI自动重建果蝇大脑,离绘制人脑更进一步

来源&#xff1a;googleblog、biorxiv、venturebeat导语&#xff1a;将果蝇的大脑分割成成千上万个40纳米的超薄切片&#xff1f;不怕&#xff0c;谷歌新AI技术能够重建果蝇完整大脑。智东西8月6日消息&#xff0c;据外媒报道&#xff0c;谷歌刚刚公布了一项最新研究结果“用洪…