<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>DOM介绍</title> </head> <body> <script> /* DOM Document节点‘ 描述: (1)DOM全称为Document Object Model,即文档对象模型,- 它是一套用来管理控制html文档的规则 (2)document节点:document节点就是文档本身 说明: (1)节点是对象的另外一种叫法,在DOM规则中规定对象都称为节点 (2)DOM规定页面中所有的元素都是节点 */ console.log(document); console.log(document.head); </script> </body> </html>
老师,这是怎么回事?
老师为什我的WebStorm用ie打不开呢,用法子打开吗,其它的可以的
<!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> document.write('hello<br/>world'); document.write('<br/>'); document.write('hello' + '<br/>' + 'world'); alert('hello\nworld'); alert('hello' + '\n' + 'world'); </script> </body> </html>
老师 您好 我想问一下 代码里的<br/> 和\n 加不加引号有区别吗
<!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> for (var i = 1; i <= 6; i++) { for (var k = 6 - i; k >= 0; k--) { document.write(' '); } for (var j = 1; j <= 2 * i - 1; j++) { document.write('*'); } document.write('<br/>'); } </script> </body> </html>
老师 输出图案的那个题 这么写可以吗
老师,为啥点击运行没反应
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML事件</title>
</head>
<style>
.div1{
width:200px;
height:200px;
background-color:blue;
}
.div2{
width:100px;
height:100px;
background-color:pink;
margin:25px auto;
</style>
<body>
<div class="div1" onclick="te1">这是div1
<div class="div2" onclick="te2">
这是div2
</div>
<script>
var div1=document.querySelector('.div1');
var div2=document.querySelector('.div2');
function te1(){console.log("这是第一个函数");}
function te2(){console.log("这是第二个函数");}
</script>
<hr/>
</body>
</html>
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>js练习</title> </head> <body> <script> var obj={ name:'xinyu', age:23, sex:'male' }; console.log(obj.name); </script> </body> </html>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>封装和公私有</title> </head> <body> <script> /* 封装 描述:封装是指构造具有某种特征的类,以通过对其进行实例化,来获得满足 需求的对象的过程 特征: 公有:对象中属性和方法,在对象外部能够直接访问,这样的属性和方法就 称为公有的属性和方法 私有:对象中属性和方法,仅在对象内部使用,这样的属性和方法就 称为私有的属性和方法 实现: 通过在构造函数中,(this.属性)的方法为类添加公有的属性和方法 this.属性添加的内容在对象的外部能够直接被访问 通过在构造函数中,(添加局部变量和闭包)的方式为类添加私有的属性和方法 局部变量保证了对象外部无法直接获取 闭包保证了对象外部可以间接获取 特权函数: 在js对象中能够用来访问内部局部变量的函数 使用特权来模拟私有的赋值调用过程 例子: function People(pname,pability) { //公有的属性和方法 this.pname=pname; this.ability=pability; //js局部变量来模拟私有属性和方法 var secret='梦'; } var beixi=new People('贾先生',function () { console.log('敲代码'); }); console.log(beixi.pname); beixi.pability(); //私有的属性和方法不能在对象之外直接访问 //console.log(beixi.secret); beixi.getSecret(); */ function People(pname,pability,eyesNum) { //公有的属性和方法 this.pname=pname; this.ability=pability; //js局部变量来模拟私有属性和方法 var secret='梦'; //特权函数 this.getSecret=function () { console.log(secret); } this.eyesNum=eyesNum; } //prototype原型:为了解决js模拟面向对象时,一些(共同拥有的属性值) //而出现的解决方法 People.prototype.eyesNum=2; People.prototype.breahte=function(){ console.log('呼吸'); } var beixi=new People('贾先生',function () { console.log('敲代码'); }); var liushishi=new People('刘诗诗',function () { console.log('卖萌'); }); //公有的属性和方法能够在对象之外直接访问 console.log(beixi.pname); beixi.pability(); //私有的属性和方法不能在对象之外直接访问 //console.log(beixi.secret); beixi.getSecret(); console.log(beixi.eyesNum); console.log(liushishi.eyesNum); beixi.breahte(); liushishi.breahte(); </script> </body> </html>
老师,我这个
beixi.pability(); //私有的属性和方法不能在对象之外直接访问
这一个地方在浏览器报错了,后面出不来了
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>数据解析</title> </head> <br> <from action="" method="get"> 姓名:<input type="text" name="userName"><br/> 年龄:<input type="text" name="age"><br/> 性别:<input type="text" name="sex"><br/> <input type="submit"> </from> <br/> <button>解析数据</button> <script> var but=document.querySelector('button'); function dataParse(outInfo){ var obj={}; var infoStr=outInfo; console.log(infoStr); //获取问号后面的数据 var realInfo=infoStr.slice(1); var proArr=realInfo.split('&'); for (var i=0;i<proArr.length;i++){ var tempArr=proArr[i].split('='); obj[tempArr[0]]=tempArr[1]; } return obj; } but.onclick=function () { var dataObj=dataParse(document.location.search); console.log(dataObj); } </script> </body> </html>
老师,我这个解析数据解析不出来
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>自定义右键菜单</title> <style> *{margin: 0;padding: 0;} ul{ list-style: none; background-color: darkgray; min-width: 220px; display: inline-block; position: absolute; display: none; } ul li{ height: 30px; line-height: 30px; padding: 5px 20px; cursor: pointer;/*光标变小手*/ transition:0.3s; } ul li:hover{ background-color: orange; color: white; } </style> </head> <body> <ul> <li>我想你了!</li> <li>你真的忍心离开本页面吗?</li> <li>去百度搜索页面中选中的内容</li> <li>输入内容然后去百度搜索</li> </ul> <textarea cols="80" rows="20"></textarea> <script> var ul=document.querySelector('ul'); //系统右键菜单禁用事件【contextmenu】 document.oncontextmenu = function (eve) { return false; //return false表示事件禁用 } document.onmouseup=function (eve) { //eve.button能够判断鼠标用的是哪个按钮 //0 左键 1滚轮 2右键 if (eve.button==2){ ul.style.display='inline-block'; //设置鼠标点击的位置 ul.style.left=eve.clientX+'px'; ul.style.top=eve.clientY+'px'; }else { //关闭菜单 ul.style.display='none'; } } //点击某一个菜单选项时触发的事件(事件委托) ul.onmousedown=function (eve) { if (eve.target.innerHTML=='我想你了!'){ alert('那就去吧,她在北京三区'); }else if (eve.target.innerHTML=='你真的忍心离开本页面吗!'){ if (confirm('你真的忍心离开本页面吗!')){ window.close(); } }else if (eve.target.innerHTML=='去百度搜索页面中选中的内容!'){ var resukt=document.getSelection().toString(); window.open('http://www.baidu.com/s?wd='+resukt); }else{ var result=prompt('输入内容然后去百度搜索'); window.open('http://www.baidu.com/s?wd='+result); } } </script> </body> </html>
老师,我这个第三个功能实现不了,我也不知道是什么原因?
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>正则-检索模式-1</title> </head> <body> <script> //检索模式====表达式模式---元字符模式--量词模式 //表达式模式--a][abc]--b][0-9]--c][m|n] var str="12abc12ABC"; var str1='你好,佛可栏,回家吃饭了,'; var newStr4=str.replace(/(ab)/gi,'go'); var newStr1=str1.replace(/[佛][可][栏]/g,'张账务'); var newStr2=str1.replace(/佛可栏/g,'张账务'); var newStr3=str1.replace(/(佛可栏)/g,'张财务'); console.log(newStr1); console.log(newStr2); console.log(newStr3); console.log(newStr4); </script> </body> </html>
这四种,中英文的都可以吧
var x=1; var y=1; document.write(x+"</br>"); document.write(y+"</br>"); for (var z=1;z<10;z++){ var i=x; var x=y; var y=i+x; z++; document.write(y+"</br>") } </script>
老师,这里的z为什么不是小于6?
1练习中问题一
老师金字塔是怎么做出的呢,我的代码是在哪一处有了问题的呢
代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>for循环联系打印</title> </head> <body> <script> /* /!*打印5行5列的矩形 * * * * * * * * * * * * * * * * * * * * * * * * * *!/ for (var j=1;j<5;j++){ //外层循环控制行 for (var i=1;i<5;i++){ //内层循环控制列 document.write("*") } document.write("<br/>"); }*/ /*打印5行5列的矩形 * * * * * * * * * * * * * * * for (var j=1;j<5;j++){ //外层循环控制行 for (var i=1;i<=j;i++){ //内层循环控制列 document.write("*") } document.write("<br/>"); }*/ /*打印5行5列的矩形 * * * * * * * * * * * * * * * */ var alt=""; for (var i=1;i<=5;i++){ //控制行 var blank="" for (var j=1;j<=5-i;j++){ //空白三角形 blank+="" } var stars=""; for (var m=1;m<=2*i-1;m++){ stars+="*"; } alt+=blank+stars+"\n"; } console.log(alt); </script> </body> </html>
运行图.
作业图
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>原型</title> </head> <body> <script> /* //原型 function func() {} func.prototype.name = '张三'; func.prototype.age=18; func.prototype.sex='男'; var obj= new func(); console.log(obj); function People(){} //console.log(People.prototype.constructor); console.log(People.prototype); var beixi=new People(); console.log(beixi.__proto__); */ function People(){} var peo1=new People(); var peo2=new People(); People.prototype.frineds=['张三','李四','王五','找刘']; peo1.frineds.pop(); console.log(peo1.frineds); console.log(peo2.frineds); </script> </body> </html>
为什么我的俩个都删除了呢
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>构造函数</title> </head> <body> <script> function Car(lun1,lun2,lun3,lun4,ability) { this.lun1=lun1; this.lun2=lun2; this.lun3=lun3; this.lun4=lun4; this.ability=ability; } var myCar1=new Car('左前轮1','右前轮1','左后轮1','右后轮1',function () { console.log("能跑1"); }); var myCar2=new Car('左前轮2','右前轮2','左后轮2','右后轮2',function () { console.log("能跑2"); }); console.log(myCar1); console.log(myCar2); </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> <ul> <li></li> <li></li> <li></li> <li></li> </ul> <script> var arr=['首页','游戏','直播','视频']; var ul=document.querySelector('ul'); var li=document.querySelectorAll('li'); for(var i=0;i<arr.length;i++){ li[i].innerHTML=arr[i]; } ul.onclick=function(){ li.style.cssText='background-color:red'; } </script> </body> </html>
老师哪里写错了吗
非常抱歉给您带来不好的体验!为了更深入的了解您的学习情况以及遇到的问题,您可以直接拨打投诉热线:
我们将在第一时间处理好您的问题!
关于
课程分类
百战程序员微信公众号
百战程序员微信小程序
©2014-2025百战汇智(北京)科技有限公司 All Rights Reserved 北京亦庄经济开发区科创十四街 赛蒂国际工业园网站维护:百战汇智(北京)科技有限公司 京公网安备 11011402011233号 京ICP备18060230号-3 营业执照 经营许可证:京B2-20212637