前端04

最新推荐文章于 2021-12-28 00:15:00 发布

香鱼嫩虾

最新推荐文章于 2021-12-28 00:15:00 发布

阅读量223

点赞数

分类专栏： HTML&CSS&JS 文章标签： javascript

本文链接：https://blog.csdn.net/hypertext123/article/details/117166971

版权

HTML&CSS&JS 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

本文详细介绍了JavaScript的基本概念，包括数据类型、运算符和流程控制语句。重点讲解了DOM操作，如选择元素、修改属性以及创建和删除节点，并提供了实际的代码示例，演示了如何实现下拉框内容的左右切换。此外，还涵盖了函数声明的多种方式和闭包的概念。

摘要由CSDN通过智能技术生成

题目

题目1

一个盒模型，它有如下属性。那么，它真实占有的宽度是多少？( D) 
width:200px;  
height:200px; 
border:1px solid red;  
padding:10px 20px;

A、 200px;
B、 202px;
C、 222px;
D、 242px;
答案 D
解析：200+1+1+20+20
由大到小
Margin border padding width

题目2

“相对定位”是相对何者定位？( )
A、离自己最近的已经定位了的祖先盒子
B、自己原来的位置
C、浏览器窗口的左上角
D、页面版心
答案B

题目3

如何让一个div的显示方式与span标签一样的( B )
A、display: block
B、 display: inline
C、 display: inline-block
D、 display: block-inline

题目4

下列选项中关于浏览器对象说法错误的是：（C）
A、history对象记录了用户在一个浏览器中已经访问过的URL。
B、location对象相当于IE浏览器中的地址栏，包含关于当前的URL地址信息。
C、location对象是history对象的父对象。
D、location对象是window对象的子对象。

解析:location和history间没有父子关系

题目5

javascript中可以输入内容的提示框是？（C ）
A、alert
B、confirm
C、prompt
D、console.log
解析：B confirm方法用于显示一个带有指定消息和 OK 及取消按钮的对话框。
如果用户点击确定按钮，则 confirm() 返回 true。如果点击取消按钮，则 confirm() 返回 false。
C promt 将暂停对JavaScript代码的执行，在用户做出相应之前，不会执行下一条语句。
C选项可以输入内容

题目6

表单元素input的type属性的取值不可以是（C）
A、image
B、checkbox
C、select
D、button
C是下拉框

题目7

下面哪一个是用来追加到指定元素的末尾的?( )
A、insertAfter()
B、append()
C、appendTo()
D、after()

题目8

下面哪一个是用来追加到指定元素的末尾的?( )
A、insertAfter()
B、append()
C、appendTo()
D、after()
答案 C

题目8

JQuery中，属于绑定鼠标事件方法的选项是( B )
A、onclick( )
B、mouseover( )
C、onmouseout( )
D、blur( )
A选项点击事件
C选项鼠标移出

题目9

下列哪一项是在新窗口中打开网页文档。 B
A、_self
B、_blank
C、_top
D、_parent
解析：
A当前页面
C顶层窗口
D在父窗口

题目10

在 HTML5 中，哪个属性用于规定输入字段是必填的？ B
A、readonly
B、required
C、validat
D、placeholder
解析D
提供可描述输入字段预期值的提示信息

题目11

下面关于文件路径的说法错误的是B
A、“…/” 是返回当前目录的上一级目录
B、“…/” 是返回当前目录的下一级目录
C、访问下一级目录直接输入相应的目录名即可
D、文件路径指文件存储的位置
解析: …/ 和 …都是返回当前目录的上一级

题目12

题目：编写代码，实现下拉框的内容左右切换
在这里插入图片描述
解题思路：

点击向右按钮
得到两个下拉框的dom对象
对这两个dom对象操作
把左边的选中的选项添加到右边的下拉框
点击向左按钮
得到两个下拉框的dom对象
对这两个dom对象操作
把右边的选中的选项添加到左边的下拉框

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			#d1{
				width:120px;
				height: 120px;
				float: left;	
			}
			#d2{
				width:120px;
				height: 120px;
				float: left;	
			}
			#d3{
				width:120px;
				height: 120px;
				float: left;	
			}
			
		</style>
		<script type="text/javascript">
			 function toRight() {
			var s1 = document.getElementById("s1");
			var s2 = document.getElementById("s2");
				for (var i = s1.options.length - 1; i >= 0; i--) {
					if (s1.options[i].selected) {
						s2.appendChild(s1.options[i]);
					}
				}
			}
			 function toLeft() {
			var s1 = document.getElementById("s1");
			var s2 = document.getElementById("s2");
				//遍历第二个下拉框找到选中的选项放到数组中
				for (var i = s2.options.length - 1; i >= 0; i--) {
					if (s2.options[i].selected) {
						s1.appendChild(s2.options[i]);
					}
				}
			}
		</script>
	</head>
	<body>
		<div id="d1">
			<select name="s1" id="s1" multiple="multiple">
				<option value="学号">学号</option>
				<option value="姓名">姓名</option>
				<option value="年龄">年龄</option>
				<option value="专业">专业</option>
			</select>
		</div>
		<div id="d2">
			<button  onclick="toRight()">&gt;&gt;</button>
			<button  onclick="toLeft()">&lt;&lt;</button>
		</div>
		<div id="d3">
			<select name="s2" id="s2" multiple="multiple">
			</select>
		</div>
	</body>
</html>

js 的引入方式

1.内嵌 javascript 脚本
2.引入外部的 javascript 文件
3.在事件中编写 javascript(不推荐)。
4.模块化引入

基本数据类型

undefined
null 类型
boolean 类型
number 类型
string 类型

运算符

位运算符：按照数值的二进制位进行运算。
算术运算符：完成基本的数学运算的符号，比如数字的处理使用到算术运算符号。
赋值运算符：它的作用是将一个表达式的值赋给一个变量。
比较运算符：比较数据的大小等使用的运算符。
逻辑运算符：用于连接 boolean 类型的表达式，计算最终逻辑值。
条件运算符：三目运算符。

流程控制语句

if else
switch
do while
while
for

函数声明的格式

function 函数名(形参){
函数体
}
函数名(实参);中软国际(ETC)天津卓越信息技术有限公司

定义函数的几种方式:

1.普通函数方式：
function functionName(paramter) {}
2.匿名函数
window.οnlοad=function(){}
3.函数表达式
var f=function(){}
f();
4.Function 对象：不建议使用，但可以帮助我们理解 js 的核心
var b = new Function(‘a’,‘b’,‘return a+b’);

闭包:

闭包（ closure ）：闭包的目的是读取其他函数内部变量，由于正常函数执行后都会进
行弹栈，从而不再保存临时变量，因此闭包会使函数的临时变量永久保存在内存中。
通过内部函数才能访问函数的变量，因此所有闭包的实现方式都是通过函数内部创建内部函
数的方式实现。

dom

1.DomObj document.getElementById(‘id’):根据ID获取DOM对象，如果获取不到返回null。
2.HTMLCollection document.getElementsByTagName(‘tagName’):根据标签名（忽略大小
写）获取全部该标签的对象。
HTMLCollection：DOM 集合对象（非 Array）又称为伪数组
3.HTMLCollection document.getElementsByName(‘name’) 根据 name 属性的值得到控件
集合(伪数组)