<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> .div1{ width: 200px; height: 200px; background-color: red; } .div2{ width:60px ; height: 50px; background-color: orange; } </style> </head> <body> <div class="div1" onclick="test1()"> <div class="div2" onclick="test2();test3()"></div> </div> <script> var i=0; var div1=document.querySelector('.div1'); /*html事件采用冒泡机制 子节点出发,传递给父节点 绑定多个函数用分号隔开 根据绑定函数的先后顺序,触发事件顺序 */ function test1() { i++; alert('div1'); console.log(i); } if (i>=3) { div1.setAttribute('onclick',null); } else { } function test2() {alert('div2'); } function test3() { } </script> </body> </html>
老师,怎么才能点第三次div1的时候不会触发事件
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <ul> <li class="1">11</li>1111 <li class="2"></li> </ul> <div id="div1"></div> <script> var li=document.createElement('li'); var li_text=document.createTextNode('1qianmian'); li.appendChild(li_text); var ul=document.querySelector('ul'); ul.insertBefore(li,ul.firstChild); /* 语法 noded.insertBefore(node1,node2) node1是插入进去的节点 node2是node1插入在node2子节点前面(插入位置) 返回值 是返回插入的节点 */ var li_list=document.querySelectorAll('li'); /*node.removeChild(node1) node为node1的父节点,node1为需要删除的节点*/ var div=document.querySelector('div'); ul.removeChild(li_list[0]); console.log(li_list); var but=document.createElement('button'); but.innerHTML='替换'; document.body.appendChild(but); but.onclick=function(){ var span=document.createTextNode('tihuan') ul.replaceChild(span,ul.childNodes[1]); } /*node.contains(node1) node是否包含node1 node为node1 父节点 返回布尔值 */ var buer=ul.contains(ul.childNodes[1]); console.log(buer); </script> </body> </html>
老师为啥var buer=ul.contains(ul.childNodes[1]) ul包含li 但是代码写成var buer=ul.contains(li)就是false
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <ul> <li class="1">11</li> <li class="2"></li> </ul> <div id="div1"></div> <script> var li=document.createElement('li'); var li_text=document.createTextNode('1qianmian'); li.appendChild(li_text); var ul=document.querySelector('ul'); ul.insertBefore(li,ul.firstChild); /* 语法 noded.insertBefore(node1,node2) node1是插入进去的节点 node2是node1插入在node2子节点前面(插入位置) 返回值 是返回插入的节点 */ var li_list=document.querySelectorAll('li'); var div=document.querySelector('div'); ul.removeChild(li_list[0]); console.log(li_list); </script> </body> </html>
老师为啥我删除了第一个文本内容 为1qianmian的li 页面删除了为啥 搜索li元素,集合还可以搜索到3个li?
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body><span>11 <div> 22 </div> <div>3</div> </span> <script> /*var span=document.querySelector('span'); console.log(span.nodeName); 通用属性节点.nodeName node.Type 节点.ownerDocument 返回当前节点所在顶层文档对象 Document .ownerDocument返回null 节点.nextSibling属性返回此节点的下一个同级节点(回车也算一个节点,文本节点)没有返回null 节点.previousSibling 属性返回此节点的上一个同级节点(回车也算一个节点,文本节点)没有返回null 节点.parentNode 返回当前节点的父节点 ,没有返回null(例如document) 节点.parentElement 返回当前节点的父元素节点 ,没有或者父节点不是元素节点返回null(例如document) console.log(span.nodeType);*/ /*var span=document.querySelector('span'); 节点.textContent 返回当前节点及当前节点的后代节点的文本内容 var text_Content=span.textContent; 节点.nodeValue 一般用书文本节点 返回当前节点的值 console.log(text_Content);*/ var span=document.querySelector('span'); console.log(span.childNodes); console.log(document.body.lastChild) console.log(document.body.firstChild) </script> aa </body> </html>
lk老师为啥body最后一个子节点不是aa吗 为啥是scrpit?
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> </style> </head> <body> <div class="one" style="width: 30px"></div> <script> var style_one=document.querySelector('.one').style; var width_1=style_one.getPropetryValue("width"); console.log(width_1); </script> </body> </html>
不知道为啥浏览器输出不了,报错
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> </style> </head> <body> <div class="one" style="width: 30px;"></div> <script> // var h2=document.createElement('h2'); // var h2_style=document.createAttribute('style'); // h2_style.value='color:red'; // h2.innerHTML='我是h2'; // h2.setAttributeNode(h2_style); // document.body.appendChild(h2); // var but=document.createElement('button'); // var button_style=document.createAttribute('style'); // button_style.value='height:50px;width:30px;' // button.innerHTML='操作'; // document.body.appendChild(button); var style_one=document.getElementsByClassName('one'); console.log(style_one.style.getpropetryValue('width')); </script> </body> </html>
我想获取div的宽度但是浏览器显示最后一行代码出错 编辑器没提示出错
var alt = ""; for (var i = 1; i <= 5; i++) { //控制行 var blank = ""; for (var j = 1; j <= 5 - i; j++) { //控制空白三角形 blank += " "; } var starts = ""; for (var m = 1; m <= 2 * i - 1; m++) { starts += "*"; } alt += blank + starts + "<br/>"; } document.write(alt); console.log(alt);
老师看下这种有没有错
var i=1; var evensum=0; var oddsum=0; while (i<=100){ if(i%2==0){ evensum+=i; }else{ oddsum+=i; } //i=i+1; //i+=1; i++; } document.write("偶数之和:"+evensum+"<hr/>"); document.write("奇数之和:"+oddsum);
这个应该是没有什么问题的吧
<script> /*var i=1; //死循环; while (i<=100){ document.write(i); }*/ var i=1; while (i<=100){ document.write(i+"<br/>"); //i=i+1; //i+=1; i++; } </script>
这种应该是可以的吧
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>window对象的name属性</title> </head> <body> <button>跨域传输</button> <script> /* var name=123; console.log(name); console.log(typeof name); var age=123; console.log(age); console.log(typeof age); */ /* window.name 描述:是页面在切换之后,甚至域名更改之后会储存信息的容器 说明:借助window.name可以实现页面之间数据的传递,称为跨域传输。 */ //console.log(num); //如果想要获取一个页面的信息,那么必须先加载 var but=document.querySelector('button'); but.onclick=function(){ var iframe=document.createElement('iframe'); iframe.src='page.html';//加载保存了信息的页面 iframe.style.display='none'; document.body.appendChild(iframe); //当iframe加载完成,意味着window.name的内容已经被赋予完成 iframe.onload=function(eve){ var iframeWindowName=eve.target.contentWindow.name; //console.log(iframeWindowName); eval(iframeWindowName); console.log(num); } } </script> </body> </html>
老师为什么这一行在vscode里运行会报错误呢?在WebStorm 就可以运行!!
<script> var s=prompt("请输入您的分数:"); var s=parseInt(s/10); switch (s) { case 10: case 9: document.write("A"); break; case 8: document.write("B"); break; case 7: case 6: document.write("C"); break; default: document.write("不及格"); } </script>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>沈番薯大傻逼</title> </head> <body> <script> setInterval( function() { var doTitle=document.title; var arr1=doTitle.split(''); // console.log(arr1); arr1.push(arr1.shift()); var str=arr1.join(''); document.title=str; },500) </script> </body> </html>
老师,为啥标题不会自己转
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <script> var arr1=[23,12,43,25,45,66]; var num_max=0,mun_min=0; function max_xiabiao(arr1) { for(var i=0;i<arr1.lenght;i++){ if (arr1[i]>arr1[i+1]) { num_max=arr1[i] }else{ num_max=arr1[i+1]; } } console.log('最大值'+num_max); } max_xiabiao(arr1); </script> </body> </html>
求这个数组最大最小值下标 这代码有什么问题吗
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <script> var arr1=[11,'a','c']; var arr2=arr1; var arr3=arr2; console.log(arr3,arr2); arr1=[22,'aa','cc']; console.log(arr2,arr3); </script> </body> </html>
老师,数组不是object的特殊类型吗,三个数组不是都指向同一个地址吗,为啥arr1变了 arr2 arr3不变?
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <script> function fun1(a,b) { var sum=a+b; console.log(sum); } function fun1(a,b,c) { var sum=a-b-c; console.log(sum); } fun1(1,2,3); </script> </body> </html>
老师,js是不是没有方法重载这个概念的?
非常抱歉给您带来不好的体验!为了更深入的了解您的学习情况以及遇到的问题,您可以直接拨打投诉热线:
我们将在第一时间处理好您的问题!
关于
课程分类
百战程序员微信公众号
百战程序员微信小程序
©2014-2025百战汇智(北京)科技有限公司 All Rights Reserved 北京亦庄经济开发区科创十四街 赛蒂国际工业园网站维护:百战汇智(北京)科技有限公司 京公网安备 11011402011233号 京ICP备18060230号-3 营业执照 经营许可证:京B2-20212637