day028

最新推荐文章于 2024-10-02 05:39:15 发布

发电机箱

最新推荐文章于 2024-10-02 05:39:15 发布

阅读量67

点赞数

分类专栏：学习文章标签： javascript html

本文链接：https://blog.csdn.net/qq_41916663/article/details/120368504

版权

学习专栏收录该内容

43 篇文章 0 订阅

订阅专栏

JS数组相当于JAVA的object数组
且JS的数组长度随时可以改
↓
JS是弱类型/直译式(无需编译直接运行)语言

直译语言（Interpreted language），又称直译式语言，是一种编程语言，它不需要经过编译器先行编译为机器码，之后直接在CPU中运行。相对的，编程语言需要通过解释器，在运行期动态直译（interpret）。
许多编程语言同时采用编译器与解释器来实现，其中包括Lisp, Pascal, C, BASIC 与 Python。理论上，任何编程语言都可以是编译式，或直译式的。它们之间的区别，仅与程序的应用有关。

select技巧 ---- 之union/union all

SELECT *  
FROM box  
WHERE id<400  

UNION

SELECT *  
FROM box  
WHERE id>100 AND id<600

union和union all的区别是，union会自动去掉多个结果集合中的重复结果，
而union all则将所有的结果全部显示出来，不管是不是重复

union：对两个结果集进行并集操作，不包括重复行，同时进行默认规则的排序

union在进行表链接后会筛选掉重复的记录，
所以在表链接后会对所产生的结果集进行排序运算，删除重复的记录再返回结果。

实际大部分应用中是不会产生重复的记录，最常见的是过程表与历史表UNION

js没有FOREACH,有FORIN

数组–空间连续–每个元素有一个连续的下标–找起来快

目标:提高复用性和松耦合

数据结构的存储方式只有两种：数组（顺序存储）和链表（链式存储）

为什么数组比链表查询速度更快？

数组由于是紧凑连续存储,可以随机访问，通过索引快速找到对应元素，而且相对节约存储空间。但正因为连续存储，内存空间必须一次性分配够，所以说数组如果要扩容，需要重新分配一块更大的空间，再把数据全部复制过去，时间复杂度 O(N)；而且你如果想在数组中间进行插入和删除，每次必须搬移后面的所有数据以保持连续，时间复杂度 O(N)。

链表因为元素不连续，而是靠指针指向下一个元素的位置，所以不存在数组的扩容问题；如果知道某一元素的前驱和后驱，操作指针即可删除该元素或者插入新元素，时间复杂度O(1)。但是正因为存储空间不连续，你无法根据一个索引算出对应元素的地址，所以不能随机访问；而且由于每个元素必须存储指向前后元素位置的指针，会消耗相对更多的储存空间。

JS函数
函数就是一个具有功能的代码块, 可以反复调用

函数就是包裹在花括号中的代码块，前面使用了关键词 function

方式一：通过function关键字声明函数
声明：function 函数名称(参数列表){ 函数体 }
调用: 函数名称(参数列表);

方式二：通过函数直接量声明函数
声明：var 函数名称 = function(参数列表){ 函数体 }
调用: 函数名称(参数列表);

JS对象
利用function关键字声明对象，用new关键字创建对象。

内置对象
String/Array/Number/Math/JSON…

Window对象–代表浏览器中一个打开的窗口,了解一下即可，很多被UI替代
window.onload() 在浏览器加载完整个html后立即执行!
window.alert(“text”) 提示信息会话框
window.confirm(“text”) 确认会话框
window.prompt(“text”) 键盘输入会话框
window.event 事件对象
window.document 文档对象

Document对象–代表整个HTML文档，可用来访问页面中的所有元素
document.write() 动态向页面写入内容
document.getElementById(id) 获得指定id值的元素
document.getElementsByName(name) 获得指定Name值的元素

自定义对象
(1)方式一(原型方式)：

声明对象：function Person(){}---------------构造方法

创建对象：var p1 = new Person();

设置属性：p1.name = “张飞”; p1.age = 18;

设置方法：p1.run = function(){ alert(this.name+" : "+this.age); }

访问p1对象：
/* 自定义对象*/
function Person(){ } /* 定义对象*/
var p1 = new Person(); /* 创建对象*/
p1.name=“张三”;
p1.age=20;
console.log(p1);
p1.say = function(){ /* 定义函数*/
console.log(“haha”);
}
p1.say(); /* 函数调用*/

js的强大之处就在于:它的属性可以边写边创建，非常灵活，而java不行，必须先定义。

(2)方式二:

var LI ={
NAME:“李四”,/* 绑定属性 */
“PAGE”:100,

P_SAY:function(){
	/* this使用LI里定义的 */
	console.log(this.PNAME+this.PAGE+"岁了.");
},

RUN:function(first,second){
	return (200+first+second);
}

}

console.log(LI);

console.log(LI.PAGE)/* 调用属性 */

var text = LI.RUN(“多发点”,“驱蚊灯”);

LI.PSAY();/* 函数调用 */

DOM树的作用
组成
ECMAScript描述了javascript语言的语法和基本对象

文档对象模型DOM（Document Object Model）与HTML网页API接口

浏览器对象模型BOM（Browser Object Model），与浏览器进行交互的API接口

核心对象有：
window浏览器窗口，
navigator浏览器信息，
location浏览器当前地址信息，
history浏览器历史信息，
screen用户屏幕信息。

DOM树结构
DOM 是一项 W3C (World Wide Web Consortium) 标准，
DOM（Document Object Model）文档对象模型为JS操作html文档所提供的一套API，
通过这套API可以很方便的对html元素进行访问及增删改查操作。

			/* 按id获取,返回1个 */
			var x = document.getElementById("div1");
			x.innerHTML="<h1>你好div</h1>";
			
			/* 按name属性值获取,返回多个*/
			var y = document.getElementsByName("div2"); 
			console.log(y);//NodeList
			y[0].innerHTML="hello js...";
			
			/* 按class属性值获取,返回多个*/
			var z = document.getElementsByClassName("span1");
			console.log(z);//HTMLCollection
			z[0].innerText="<p>我变了</p>"
			
			/* 按照标签名获取,返回多个 */
			var m = document.getElementsByTagName("div");
			console.log(m);//HTMLCollection
			m[1].style.fontSize=30+"px";

–获取对象: window.document
–调用方法:
getElementById(“元素的id的属性的值”)–返回1个元素
getElementsByName(“元素的name属性的值”)–返回多个元素(用数组)
getElementsByClassName(“元素的class属性的值”)–返回多个元素(用数组)
getElementsByTagName(“元素的标签名的值”)–返回多个元素(用数组)
write()–向文档写 HTML 表达式或 JavaScript 代码
title–返回网页的标题
id–设置或返回元素的id

innerHTML–设置或返回元素的内容

1） innerHTML设置或获取标签所包含的HTML+文本信息(可以分辨出HTML标签)
(从标签起始位置到终止位置全部内容，【包括】HTML标签，但不包括自身)

2） innerText设置或获取标签所包含的文本信息（全部视为文本）
（从标签起始位置到终止位置的内容，【去除】HTML标签，但不包括自身）

function test1(){
//需求2：输出第一个name=“n1”的元素内容
//document.getElementsByName根据name属性获取到多个属性，存入数组
//[0]按照下标，获取到数组里的第一个元素
var NN1=document.getElementsByName(“n1”)[0].innerText;
console.log(NN1);
//也可以选中元素后，直接修改内容
document.getElementsByName(“n1”)[0].innerHTML
=‘

我又变了了了

’;
}

function test2(){
//需求:输出第二个class="c1"的元素内容
var CC2=document.getElementsByClassName(“c1”)[1].innerText;
console.log(CC2);
//修改元素内容
document.getElementsByClassName(“c1”)[1].innerHTML=‘

我是p1

’;
//修改元素的样式CSS变字体的颜色
document.getElementById(“d1”).style.color=‘red’;
}

改成P标签:我是p1
document.getElementsByClassName(“c1”)[1].innerHTML=‘

我是p1

’;