【Educoder】JavaScript答案（JavaScript基础入门、文档元素获取、 文档元素操作、事件处理、浏览器对象模型）

已于 2022-04-15 14:35:21 修改
阅读量5.3k 收藏 76
点赞数 8
分类专栏： Educoder 文章标签： javascript educoder
于 2022-04-14 14:49:10 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_37746855/article/details/124170583
版权

文章目录

JavaScript 简介

JavaScript基础入门

  • 编程要求
    本关的编程任务是补全右侧代码片段中 Begin 至 End 中间的代码，具体要求如下：

采用相关知识板块介绍的任意一种方法，实现输出Hello,JavaScript!。

<!DOCTYPE html>
<html>
	<head>
    	<!-- 请在此处编写代码 -->
		<!---------Begin--------->
		<script>
        console.log("Hello,JavaScript!");
		</script>
		<!---------End--------->
	</head>
	<body>
	</body>
</html>

JavaScript与HTML

  • 编程要求
    本关的编程任务是补全右侧代码片段中 Begin 至 End 中间的代码，具体要求如下：
  1. 将下面的JavaScript代码嵌入到HTML代码中；
  2. 必须使用内置代码的方式。
console.log("如何在HTML代码中嵌入JavaScript代码");  

<!DOCTYPE html>
<html>
	<!-- 请在此处编写代码 -->
	<!---------Begin--------->
	<head>
    	<meta charset="UTF-8">
        <script>console.log("如何在HTML代码中嵌入JavaScript代码");</script>
	</head>
	<body>
	</body>
	<!---------End--------->
</html>

JavaScript变量

  • 编程要求
    本关的编程任务是补全右侧代码片段中 Begin 至 End 中间的代码，具体要求如下：
  1. 定义一个局部变量 a ，并赋值使其覆盖已有的全局变量 a ；
  2. 定义一个全局变量 b 并初始化之；
  3. 上面两步必须使得函数 variableTest 返回100+10*c， c 为输入；
  4. 具体请参见后续测试样例。
var a = 1;
// 请在此处编写代码
/********** Begin **********/
var b=100;
/********** End **********/
function variableTest(c) {
	/********** Begin **********/
	var a=10;
	/********** End **********/
    return a*c+b;
}

JavaScript 文档元素获取

通过id获取文档元素

  • 编程要求
    本关的编程任务是补全右侧代码片段中 Begin 至 End 中间的代码，具体要求如下：

  1. 获取本文档中 id 为 a1 的文档元素，要求用 id 获取文档元素；

  2. 将获取的元素赋值给变量 myElement ；

  3. 具体请参见后续测试样例。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>get element by id</title>
</head>
<body>
    <a id="a1" src="https://www.google.com">Google</a>
    <p id="p1">this is a text</p>
    <script>
    	<!-- 请在此处编写代码 -->
        <!---------Begin--------->
        var myElement =document.getElementById("a1");
        <!---------End--------->
        myElement.href="https://www.educoder.net";
    </script>
</body>
</html>

通过类名获取文档元素

  • 编程要求
    本关的编程任务是补全右侧代码片段中 Begin 至 End 中间的代码，具体要求如下：

  1. 通过getElementsByClassName()方法获取文档中唯一的

    元素；

  2. 将获取到的结果赋值给变量 myElement 。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>get element by name</title>
</head>
<body>
    <img src="" class="myName"/>
    <form class="myName" id="myForm"></form>
    <div class="myName">This is quote</div>
    <p class="myName">This is what you should get</p>
    <script>
    	<!-- 请在此处编写代码 -->
        <!---------Begin--------->
      	var myNodeList = document.getElementsByClassName("myName");  
        var myElement =myNodeList[3];
        <!---------End--------->
        myElement.innerText="I changed the text";
    </script>
</body>
</html>

通过标签名获取文档元素

  • 编程要求
    本关的编程任务是补全右侧代码片段中 Begin 至 End 中间的代码，具体要求如下：

  1. 获取第二个 div 元素下的第二个 a 元素，要求通过使用标签名获取；

  2. 将获取到的结果赋值给变量 myElement 。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>get element by id</title>

</head>
<body>
    <div class="diva">
        <a href="https://www.educoder.net">EduCoder</a>
        <a href="https://www.facebook.com">FaceBook</a>
    </div>
    <div class="divb">
        <a href="https://www.twitter.com">Twitter</a>
        <form name="myForm"></form>
        <a href="https://www.nudt.edu.cn">NUDT</a>
    </div>
    <p id="pp">this is a text</p>
<script>
	<!-- 请在此处编写代码 -->
    <!---------Begin--------->
    var allDiv = document.getElementsByTagName("div");  
    var allLink = allDiv[1].getElementsByTagName("a");   
    var myElement =allLink[1];
    <!---------End--------->
    myElement.innerText="nudt";
</script>
</body>
</html>

html5中获取元素的方法一

  • 编程要求
    本关的编程任务是补全右侧代码片段中 Begin 至 End 中间的代码，具体要求如下：
  1. 获取html代码里面的第一个文本元素，并赋值给变量 pElement ，要求使用querySelector()。
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
</head>
<body>
    <p>你需要获得的元素是我</p>
    <p>是楼上</p>
    <p>是楼上的楼上</p>
    <script>
    	<!-- 请在此处编写代码 -->
        <!---------Begin--------->
        var myElement = document.querySelectorAll("p"); 
        var pElement =myElement[0];
        <!---------End--------->
        console.log(pElement);
    </script>
</body>
</html>

html5中获取元素的方法二

  • 编程要求
    本关的编程任务是补全右侧代码片段中 Begin 至 End 中间的代码，具体要求如下：
  1. 获取 html 代码里面的所有的 p 元素，并赋值给变量 pElement ，要求使用querySelectorAll()方法。
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
</head>
<body>
    <p>你需要获得的元素是我</p>
    <p>包括我</p>
    <p>还有我</p>
    <script>
    	<!-- 请在此处编写代码 -->
        <!---------Begin--------->
		var pElement =document.querySelectorAll("p");
        <!---------End--------->
        console.log(pElement);
    </script>
</body>
</html>

节点树上的操作

  • 编程要求
    本关的编程任务是补全右侧代码片段中 Begin 至 End 中间的代码，具体要求如下：

  1. 已知变量 cl2 为获取到的类为c12的节点；

  2. 要求获取该div 内文本为黄的 option 标签，并赋值给变量 myElement ；

  3. 要求使用本关相关知识中介绍的方法。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
</head>
<body>
<div id="div1">
	<div class="cl1">
		<p>文本</p>
		<a>超链接</a>
	</div>
	<div class="cl2">
		<select>
			<option>红</option>
			<option>黄</option>
			<option>蓝</option>
		</select>
	</div>
</div>
  <script>
      var cl2 = document.getElementById("div1").lastElementChild;
      <!-- 请在此处编写代码 -->
      <!---------Begin--------->
	  var myElement =cl2.firstElementChild.children[1];
      <!---------End--------->
      myElement.innerText = "绿";
    </script>
</body>
</html>

属性值的获取

  • 编程要求
    本关的编程任务是补全右侧代码片段中 Begin 至 End 中间的代码，具体要求如下：

  1. 获取 html 代码里面的 class 属性的值；

  2. 结果赋值给变量 srcValue；

  3. 获取文档元素通过类名来获取。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
</head>
<body>
    <p id="p"></p>
    <img class="imgClass"/>
    <a id="a"></a>
    <script>
    	<!-- 请在此处编写代码 -->
        <!---------Begin--------->
        var srcValue=document.getElementsByClassName("imgClass")[0].getAttribute("class");
        <!---------End--------->
        console.log(srcValue);
    </script>
</body>
</html>

属性值的设置

  • 编程要求
    本关的编程任务是补全右侧代码片段中Begin至End中间的代码，具体要求如下：

  1. 通过 id 来获取 from 元素（只有一个），赋值给变量 myElement ；

  2. 通过操作 myElement 将 form 的 method 属性改为 post；

  3. 要求必须分两步进行。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
</head>
<body>
    <p id="p"></p>
    <form id="form1" method="get" target="https://abc.xyz/def/ghi">This is form</form>
    <a id="a"></a>
    <script>
    	<!-- 请在此处编写代码 -->
        <!---------Begin--------->
        var myElement =document.getElementById("form1");
        myElement.setAttribute("method","post");
        <!---------End--------->
        console.log(document.getElementById("form1").method);
    </script>
</body>
</html>

JavaScript 文档元素操作

创建节点

  • 编程要求
    本关的编程任务是补全右侧代码片段中 Begin 至 End 中间的代码，具体要求如下：
  1. 创建一个 form 节点，然后赋值给变量 newNode，设置节点的 id 值为 myForm，method 值为 post，如下所示：
<form id="myForm" method="post"></form>

字符串类型参数用""包含在内。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
</head>
<body>
    <p></p>
    <script>
    	<!-- 请在此处编写代码 -->
        <!---------Begin--------->
		var newNode = document.createElement("form");
		newNode.id="myForm";
		newNode.method="post";
        <!---------End--------->
		document.body.appendChild(newNode);
        console.log(newNode.method);
    </script>
</body>
</html>

插入节点

  • 编程要求
    本关的编程任务是补全右侧代码片段中Begin至End中间的代码，具体要求如下：

  1. 使用createElement()创建一个li类型的新节点newNode；

  2. 通过innerText()设置该节点内部文本的内容为Canada；

  3. 通过getElementById和appendChild方法将newNode节点添加到ul标签下面，作为它的最后一个子节点；

  4. 所有的字符串类型参数请用""包含在内；

请按照以上的步骤操作。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
</head>
<body>
    <ul id="ul1">
        <li>America</li>
        <li>Mexio</li>
    </ul>
    <script>
    	<!-- 请在此处编写代码 -->
        <!---------Begin--------->
        var newNode = document.createElement("li"); 
        newNode.innerText="Canada";
        var node=document.getElementById("ul1");
        node.appendChild(newNode);
        <!---------End--------->
        var out = document.getElementsByTagName("li")[2];
        console.log(out.innerText);
    </script>
</body>
</html>

删除节点

  • 编程要求
    本关的编程任务是补全右侧代码片段中 Begin 至 End 中间的代码，要求按照步骤进行：

  1. 获取 id 为 browser 的节点，赋值给变量parent;

  2. 获取 id 为 opera 的节点，赋值给变量child；

  3. 通过removeChild()删除child节点；

  4. 获取节点使用getElementById方法；

  5. 字符串类型参数用""包含在内。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
</head>
<body>
    <ol id="browser">
        <li id="chrome">Chrome</li>
        <li id="firefox">Firefox</li>
        <li id="opera">Opera</li>
        <li id="safari">Safari</li>
    </ol>
    <script>
    	<!-- 请在此处编写代码 -->
        <!---------Begin--------->
		var parent = document.getElementById("browser");  
		var child = document.getElementById("opera");  
		parent.removeChild(child); 
        <!---------End--------->
    </script>
</body>
</html>

替换节点

本关的编程任务是补全右侧代码片段中Begin至End中间的代码，具体要求如下，请按步骤操作：

  1. 获取 id 为 parent 的节点（父节点），赋给变量 parent；

  2. 获取 id 为 old 的节点（子节点），赋给变量 old；

  3. newChild 已知，用 newChild 替换子节点 old；

  4. 使用getElementById()获取节点；

  5. 字符串参数用""包含在内。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
</head>
<body>
    <ol id="parent">
        <a id="old" href="https://www.google.com">Google</a>
    </ol>
    <script>
        var newChild = document.createElement("a");
        newChild.innerText = "eduCoder";
        newChild.href = "https://www.educoder.net";
        <!-- 请在此处编写代码 -->
        <!---------Begin--------->
   		var parent  = document.getElementById("parent");
    	var old  = document.getElementById("old"); 
		parent.replaceChild(newChild,old);
        <!---------End--------->
    </script>
</body>
</html>

综合练习

  • 编程要求
    本关的编程任务是补全右侧代码片段中 Begin 至 End 中间的代码，具体要求如下：

  1. 继续拓展相关知识中介绍的功能，要求第一列选择安徽省后，第二列下拉的选项中出现黄山市和合肥市两个选项，按照以下步骤进行；

  2. 创建一个 option 类型节点 child2；

  3. 设置 child2 的 value 属性的值为 HeFeiCity；

  4. 设置 child2 的显示的文本为 合肥市;

  5. 将 child2 设置为 id 为 city 的节点下面的第二个子节点；

  6. 使用getElementById()获取节点；

  7. 字符串类型的参数用""包含在内。

<html>
<head>
<title>myTitle</title>
<meta charset="utf-8" />
</head>
<body>
<select id="province" onChange="changeCity()">
	<option value="BeiJing" id="bj">北京</option>
    <option value="AnHui" id="ah">安徽</option>
</select>
<select id="city">
    <option value="BeiJingCity">北京市</option>
</select>
<script>
function changeCity() {
    var province = document.getElementById("province");
    var city = document.getElementById("city");
    var length = city.children.length;
    for(var i = length-1;i >= 0;i--) {
        city.removeChild(city.children[i]);
    }
    if(province.value == "BeiJing") {
        var child1 = document.createElement("option");
        child1.value="BeiJingCity";
        child1.innerText="北京市"
        city.appendChild(child1);
    } else {
        var child1 = document.createElement("option");
        child1.value="HuangShanCity";
        child1.innerText="黄山市";
        city.appendChild(child1);
        //请在此处编写代码
        /*********Begin*********/
        var child2 = document.createElement("option");
        child2.value="HeFeiCity";
        child2.innerText="合肥市";
        city.appendChild(child2);
        /*********End*********/
    }
}
</script>
</body>
</html>

JavaScript 事件处理

注册事件处理程序

  • 编程要求
    本关的编程任务是补全右侧代码片段中 Begin 至 End 中间的代码，具体要求如下：
  1. 通过getElementById()获取id为 button2 的按钮，赋值给变量 button2 ，然后使用button2.onclick()方法为该按钮绑定事件处理程序listenButton2()；
  2. 通过getElementById()获取id为button3的按钮，赋值给变量button3，然后使用button3.addEventListener()方法为该按钮绑定click事件的事件处理程序listenButton3()。
<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <button id="button1" onclick="listenButton1()">按钮1</button>
    <button id="button2">按钮2</button>
    <button id="button3">按钮3</button>
    <script>
        function listenButton1() {
            console.log("监听button1");
        }
        function listenButton2() {
            console.log("监听button2");
        }
        function listenButton3() {
            console.log("监听button3");
        }
		//请在此处编写代码
		/********** Begin **********/
        document.getElementById("button2").onclick=function(){
            listenButton2();
        }
        document.getElementById("button3").addEventListener("click",function(){
            listenButton3();
        })		/********** End **********/
    </script>
</body>
</html>

文档加载事件

  • 编程要求
    本关的编程任务是补全右侧代码片段中 Begin 至 End 中间的代码，具体要求如下：

  1. 在文档加载完成后（即文档加载事件发生后），在控制台输出 Welcome!；

  2. 字符串放在英文双引号内。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body onload="loadEvent()">
    <script>
        function loadEvent() {
		//请在此处编写代码
		/********** Begin **********/
        console.log("Welcome!");
		/********** End **********/
        }       
    </script>
</body>
</html>

鼠标事件

  • 编程要求
    本关的编程任务是补全右侧代码片段中Begin至End中间的代码，具体要求如下：

  1. 第一步：通过id获取button（按钮）元素，赋给变量myButton；

  2. 第二步：通过addEventListener为按钮绑定一个事件处理程序，用来处理按钮的鼠标单击事件；

  3. 第三步：在事件处理程序中，通过id获取p元素，赋给变量myElement，然后设置当按钮被单击后，p里面的文本被改变为clicked；

  4. 字符串类型的参数用""包含在内；

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
        <p id="p">
            text
        </p>
        <button id="but">
            button
        </button>
        <script>
			//请在此处编写代码
			/********** Begin **********/
            var myButton = document.getElementById("but");
            myButton.addEventListener("click",function() {
                var myElement = document.getElementById("p");
                myElement.innerText="clicked";
            })
  			/********** End **********/
        </script>
    </body>
</html>

键盘事件

  • 编程要求
    本关的编程任务是补全右侧代码片段中Begin至End中间的代码，具体要求如下，请按步骤操作：

  1. 获取用户按下的按键的编码，赋值给变量code；

  2. 判断code的值是否为13，是则在控制台打印cannot use enter。

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body onkeypress="pressEvent(event)">
        <script>
        	function pressEvent(event) {
				//请在此处编写代码
				/********** Begin **********/
                var code = event.which;
                if (code == 13) {
                    console.log("cannot use enter");
                }
				/********** End **********/
    		}          
        </script>
    </body>
</html>

表单事件

  • 编程要求
    本关的编程任务是补全右侧代码片段中Begin至End中间的代码，具体要求如下：

  1. 通过id属性获取id为input的文本框，赋值给变量ele；

  2. 获取输入框中当前文本的长度，赋值给变量len；

  3. 判断len的值是否小于等于12，是则打印出too short input；

  4. 字符串参数务必置于双引号之内。

<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<title>Title</title>
</head>

<body>
	<form>
		<input id="input" type="text" onchange="changeEvent()" />
		<input id="input2" type="text"  />
    	</form>
		<script>
			function changeEvent() {
			//请在此处编写代码
			/********** Begin **********/
            if(document.getElementById("input").value.length<=12){
                console.log("too short input")
            }
			/********** End **********/
    		}
		</script>
</body>

</html>

拖动事件

  • 编程要求
    本关的编程任务是补全右侧代码片段中Begin至End中间的代码，具体要求如下：

  1. 在第一个Begin和End中间设置p元素为可拖动的；

  2. 在第二个Begin和End中间使用event.target.innerText在控制台打印p元素里面的内容；

要求必须按照以上的步骤执行。

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
        <div>
        	<!-- 请在此处编写代码 -->
            <!---------Begin--------->
            <p ondrag="dragging(event)" id="p1" draggable="true">drag me</p>
            <!---------End--------->
        </div>
        <script>
            function dragging(event) {
			/********** Begin **********/
            console.log(event.target.innerText);
			/********** End **********/
            }
        </script>
    </body>
</html>

事件冒泡

  • 编程要求
    本关的编程任务是补全右侧代码片段中Begin至End中间的代码，具体要求如下：
  1. 在id为div2的元素上面阻止click事件的冒泡。
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <div id="div1" onclick="click1()">
        <div id="div2" onclick="click2()">
            <p id="p" onclick="click3()">click me!</p>
        </div>
    </div>
    <script>
        function click1() {
            console.log("root");
        }
        function click2() {
			//请在此处编写代码
			/********** Begin **********/
            window.event?window.event.cancelBubble=true:event.stopPropagation();  
			/********** End **********/
            console.log("parent");
        }
        function click3() {
            console.log("child");
        }
    </script>
</body>
</html>

JavaScript 浏览器对象模型

定时器

  • 编程要求
    本关的编程任务是补全右侧代码片段中Begin至End中间的代码，具体要求如下：
  1. 第一步，设置执行一次的定时任务timerTask()，延迟为2000毫秒，任务的唯一标识赋值给变量timeId。
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <p onclick="handleTimer()">set timer then undo</p>
    <script>
        var timeId;
        function timerTask() {
            console.log("this is timer task");
        }
        function handleTimer() {
			//请在此处编写代码
			/********** Begin **********/
            timeId=window.setTimeout(timerTask,2000);
			/********** End **********/
        }
    </script>
</body>
</html>

循环定时器

  • 编程要求
    本关的编程任务是补全右侧代码片段中Begin至End中间的代码，具体要求如下，请按步骤操作：
  1. 取消定时任务timerTask1()，要求使用本关介绍的方法。
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <p onclick="task1()">this is task onea</p>
    <p onclick="task2()">this is task two</p>
    <p onclick="removeTask1()">try to remove task one</p>
    <script>
        var timeId1;
        var timeId2;
        function timerTask1() {
            console.log("timerTask1!");
        }
        function timerTask2() {
            console.log("timerTask2!");
        }
        function task1() {
            timeId1 = window.setInterval(timerTask1,2000);
        }
        function task2() {
            timeId2 = window.setInterval(timerTask2,1500);
        }
        function removeTask1() {
			//请在此处编写代码
			/********** Begin **********/
            window.clearInterval(timeId1);
			/********** End **********/
        }
    </script>
</body>
</html>

location对象

  • 编程要求
    本关的编程任务是补全右侧代码片段中Begin至End中间的代码，具体要求如下：

  1. 第一步，获取location对象，赋值给变量loc；

  2. 第二步，利用loc打印出当前页面地址的主机名；

  3. 第三步，利用loc实现跳转到https://www.educoder.net/forums/categories/all?order=newest；

  4. 字符串参数放在英文双引号内。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <p onclick="openNew()">Click me to new page!</p>
    <script>
        function openNew() {
		//请在此处编写代码
		/********** Begin **********/
         window.location.href = "https://www.educoder.net/forums/categories/all?order=newest";
		/********** End **********/
        }
    </script>
</body>
</html>

对话框

  • 编程要求
    本关的编程任务是补全右侧代码片段中Begin至End中间的代码，具体要求如下：

  1. 第一步：弹出一个输入型对话框（输入框），用户的输入结果赋值给变量result，输入框提示语为your name，输入框默认值为Xiao Ming；

  2. 第二步：使用result判断用户的输入是否为null（不是字符串null，是表示空的null），如果是，在控制台打印name cannot be null；

  3. 字符串类型的参数用""包含在内。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <p onclick="inputName()">Click to input name!</p>
    <script>
        function inputName() {
            var result;
			//请在此处编写代码
			/********** Begin **********/
            result=window.prompt("your name","Xiao Ming");
            if(result){
                console.log(name cannot be null);
            }
			/********** End **********/
        }
    </script>
</body>
</html>

窗口

  • 编程要求
    本关的编程任务是补全右侧代码片段中Begin至End中间的代码，具体要求如下：
  1. 第一步，打开一个窗口，它的文档的地址是Demo.html，name属性是窗口名字window_name，specs和replace不用设置。将打开的窗口赋值给变量myWindow；
  2. 字符串参数放在英文双引号内。
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <p onclick="openNewWindow()">open new window</p>
    <script>
        var myWindow;
        function openNewWindow() {
		//请在此处编写代码
		/********** Begin **********/
        myWindow=window.open("Demo.html","window_name");
		/********** End **********/
        }
    </script>
</body>
</html>
eeenkidu
关注
专栏目录
Educoder JavaScript学习手册：浏览器对象模型
Junds0的博客
05-30 1390
第1关：定时器 设置执行一次的定时任务timerTask()，延迟为2000毫秒，任务的唯一标识赋值给变量timeId。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <p onclick="handleTimer()">set
Educoder JavaScript 数组学习
Junds0的博客
05-21 4396
（1）本关任务：掌握创建数组的方法，获取数组的元素和长度。 已知两个数组array1和array2，参数a是一个整数，先判断a的值与数组array1的长度值相等，如果相等，返回数组array1的最后一个元素，反之，则返回数组array2的最后一个元素； ****解析： var array1 = [1,2,3,“js”,4,true,“hello”]; var array2 = [true,true,“java”,2.1]; function mainJs(a) { //请在此处编写代码 /begin/ i
Educoder JavaScript
HONDEY的博客
11-30 641
Educoder JavaScript学习手册一 JavaScript（简称“JS”） 是一种具有函数优先的轻量级、解释型或即时编译型的编程语言，其不仅可以作为 Web 页面开发的脚本语言，也可用到很多非浏览器环境中, 广泛应用于网站前端、后台、移动开发、插件开发等。jQuery 是一个快速、简洁的 JavaScript 框架，其设计宗旨是 Write Less，Do More，即倡导写更少的代码，做更多的事情。 想成为一名合格的前端工程师，JavaScript 是必学的技能；要学会如何更快更好的做出项目，
第三课 巩固for循环
2402_82814554的博客
09-20 285
上次我已经讲过了for循环的概念，但对应用童鞋们都是一知半解，在这之前，先给大家补一个知识点：if其实有一个劲敌，那就是elae，“否则”的意思。家人们，我在第二期说粉破15出第三课，结果刚发就涨到了16，苦啊！那么我们进入实战：请在循环里面输入12个a，如果是2，就输出当前循环次数，否则输出0。第三课的内容是for循环的那些事，由于觉得第二课太粗糙了，这节课我跟你们细说一下；当我们输入0的时候，条件为真，就输出n，那如果是假，否则语句运行，输出no。
educoder答案-JavaScript语言基础知识训练合集
m0_57382477的博客
01-02 917
JS函数 B A D C C JS分支与循环 D B D C B JS条件语句 if-else类型 function mainJs(a) { a = parseInt(a); //请在此处编写代码 /********** Begin **********/ if(a<60) return "unpass"; else return "pass"; /********** End **********/ } switch类型 function mainJ
My SQL-day01-Jyunit、反射、注解
xingxing_LM的博客
12-26 254
Junit的用法 Junit单元测试： 测试分类： 1. 黑盒测试：不需要写代码，给输入值，看程序是否能够输出期望的值。 2. 白盒测试：需要写代码的。关注程序具体的执行流程。 Junit使用：白盒测试 步骤： 1. 定义一个测试类(测试用例) 建议： 测试类名：被测试的类名Test CalculatorTest 包名：xxx.xxx.xx.test test 2. 定义测试方法：可以独立运行 建议： * 方法名：test测试的方法名 testAdd
文档元素
weixin_34005042的博客
12-20 127
文本： 文档元素 一、主要作用 文档元素的主要作用就是划分各个不同的内容，让整个布局清晰明快。让整个布局具有语义，进一步代替div。 二、元素 1、h1—h6：表示标题 2、header:表示首部 3、footer:表示尾部 4、nav：表示有意集中在一起的导航元素 5、section：表示重要概念或者主题...
javaScript对象模型与事件处理资料.pdf
11-09
通过理解JavaScript的对象模型和事件处理机制，开发者可以构建动态、交互性强的网页应用。无论是修改文档内容，还是与浏览器进行高级交互，JavaScript都提供了丰富的工具和API来实现这些功能。因此，熟练掌握这些...
vue 获取元素在浏览器的位置_JavaScript获取窗口位置和元素坐标（兼容版）
weixin_39978350的博客
12-19 5030
在一些复杂的页面中经常会用JavaScript处理一些DOM元素的动态效果，这种时候我们经常会用到一些元素位置和尺寸的计算，浏览器兼容性问题也是不可忽略的一部分，要想写出预想效果的JavaScript代码，我们需要了解一些基本知识。(原文来自：博客园)基础概念为了方便理解，我们需要了解几个基础概念，每个HTML元素都有下列属性offsetWidthclientWidthscrollWidthoff...
JavaScript之document对象获取元素
zhouym_的博客
06-04 8035
document对象 概述：浏览器对外提供的支持js操作HTML文档的一种对象，这个对象封装了HTML文档中的所有对象。当HTML文档一执行，就会创键document对象，把HTML文档中的所有信息封装到document对象中，我们要获取HTML文档中的信息，只需要操作document这个对象即可。 获取元素属性，两种方式 直接获取 <!DOCTYPE html> <html&g...
13 ArcGIS API for JavaScript开发入门文档
X北辰北的博客
09-04 4867
写在前面 这篇文章写在我用ArcGIS API for JavaScript(后面统称为"ArcGIS JS API")开发了两年项目后的某一天夜里。写这篇文章主要是两个目的吧，第一个原因肯定是为后面越来越多的从事WebGIS开发的GISer提供一个学习路线，当然，我提供的这个学习路线仅仅是一个参考；第二个原因就是我想写文章了，八月份一直忙着做项目，忘记了更新博客。 什么时候适合读这篇文章呢 在校期间无聊想学WebGIS开发之前 当你参加Esri全国开发者大赛(目前最新的名称应该是"易智瑞全国.
Educoder JavaScript学习手册四：JS对象
Junds0的博客
05-21 8027
第1关：对象的创建 (1)创建你的第一个JavaScript对象。使用对象字面量方法创建名为student的对象，有两个属性name和gender，他们的值分别是mainJs()函数的参数a和参数b； 使用已给的构造函数Car(plate,owner)创建一个对象myCar，它的两个属性的值分别是参数c和参数d； 使用原型创建一个对象myJob，它的构造函数是Job(company,salary)，它的两个属性的值已经被设置，你需要用参数e覆盖属性company的值； function Car(plate,
JavaScript学习手册五：JS数组
m0_46270930的博客
11-06 4528
第5关：数组的应用——内排序 本关的编程任务是补全右侧代码片段中begin至end中间的代码，具体要求如下： 函数mainJs(a)中的变量arr是一个数组，你需要对该数组进行选择排序； 返回选择排序进行过程中，在每一趟交换前，待排序子数组的最大元素的位置组成的数组； 比如对于上面相关知识中的数组[9,5,8,0,2,6]，第一次交换前，最大的元素9的索引是0，第二次交换前，最大元素8的索引是2，第三次交换前最大元素6的索引是0，第四次交换前最大元素5的索引是1，第五次交换前最大元素2的索引是1，第六次交换
JavaScript学习手册十三：HTML DOM——文档元素的操作（一)
热门推荐
qq_45823118的博客
04-24 1万+
HTML DOM——文档元素的操作1、通过id获取文档元素任务描述相关知识什么是DOM文档元素节点树通过id获取文档元素代码文件2、通过类名获取文档元素任务描述相关知识通过类名获取文档元素代码文件3、通过标签名获取文档元素任务描述相关知识通过标签名获取文档元素获取标签内部的子元素代码文件4、html5中获取元素的方法一任务描述相关知识css选择器querySelector的用法代码文件5、html5中获取元素的方法二任务描述相关知识querySelectorAll的用法代码文件6、节点树上的操作任务描述相关
Linux 题目（educoder）
weixin_52184490的博客
10-29 3721
第1关：linux知识训练-硬件与软件安装 1、在Linux中第一块IDE磁盘的名字为（/dev/sda）。 2、当使用mount进行存储设备或者文件系统挂载的时候，需要用到的设备名称位于( /dev)目录下。 3、将一块硬盘（hdc)安装到文件系统的/mnt/hdc子目录下的命令是(mount -t ext4 /dev/hdc/mnt/hdc )。 4、已知/dev/sdb2设备挂载在/mnt文件夹中，卸载该设备的方法是(umount /mnt)。 5、欲查询 bind 套件是否有安装...
C高级第二天作业
最新发布
2301_76916204的博客
10-15 194
2. 用shell脚本写一个学生管理系统，终端输入一个成绩，90分以上输出A 80分以上输出B 60分以上输出C 其余输出D。1. 写shell脚本终端输入一个数，判断是否是偶数。
头歌实践平台linux时间编程
qq_61533665的博客
11-04 634
暂无
Java语言之文件操作
levis___的博客
05-14 4582
编程要求 本关的编程任务是补全右侧代码片段中Begin至End中间的代码，具体要求如下： 读取火车时刻表，文件路径为”src/step1/Time_Table.txt”； 将时刻表中的文件完整地打印出来。 package step1; import java.io.File; import java.io.FileReader; import java.io.IOException; public class TimeTable { public static void main(Strin
js字符串的分割
m0_56398411的博客
05-24 291
编程要求 本关的编程任务是补全右侧代码片段中Begin至End中间的代码，具体要求如下： 参数a是字符串，是一段英文的文本，单词与单词之间要么以,隔开，要么以空格字符（即键盘上的spcae键）隔开； 利用split()方法统计a中单词的个数； functionmainJs(a){ //请在此处编写代码 /**********Begin**********/ returna.split("").length+a.split(",").l...
sql语句为SELECT * FROM a a LEFT JOIN b b ON a.id= b.id,SQL用SQLsugar写
07-17
使用 SQLSugar 进行 LEFT JOIN 查询可以按照以下方式编写代码： ```csharp // 获取 SQLSugar 实例 var db = new SqlSugarClient(new ConnectionConfig { ConnectionString = "YourConnectionString", DbType = DbType.SqlServer, // 根据实际情况选择数据库类型 IsAutoCloseConnection = true // 自动关闭连接 }); // 执行 LEFT JOIN 查询 var result = db.Queryable<A, B>((a, b) => new JoinQueryInfos( JoinType.Left, a.Id == b.Id)) // 指定 LEFT JOIN 条件 .Select((a, b) => new { // 选择需要查询的字段 // 示例：a.Field1, a.Field2, b.Field3, ... // 此处需要根据实际情况选择字段 }) .ToList(); // 处理查询结果 foreach (var item in result) { // 处理每一行的数据 // 示例：item.Field1, item.Field2, item.Field3, ... // 此处需要根据实际情况处理字段值 } ``` 请根据你的实际情况修改代码中的表名、字段名、连接字符串等信息。注意，代码中的示例为 SQL Server 数据库，如果你使用的是其他数据库，请根据实际情况调整 DbType 的设置。同时，根据实际情况修改查询条件以及选择的字段。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

eeenkidu

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值