JavaScript小结2

js事件
第一种方式:内嵌
<div οnclick="alert('xx')"></div>
第二种方式:内部
<script>
  function test(t){
  }
</script>
<div οnclick="test(this)"></div>
第三种方式:通过dom的方式来分配事件

document.getElementById("指定id").οnclick=function(){ 函数体 }


js中的常用事件(列举,不详细列出使用方法)

  • onfocus(获得焦点事件)            
  • onblur(失去焦点的事件)  
  • onchange事件(select控件选中值发生改变)
  • onmouseover(鼠标移动到指定元素上方)
  • onmouseout(鼠标移出指定元素)
  • onmousedown(鼠标按下)
  • onmouseup(鼠标弹起)
  • onload 事件
  • 阻止默认行为
  • 阻止事件传递

关于隐藏和显示
style.display = "none"   隐藏之后位置不存在
style.visibility = "hidden"  这个隐藏之后位置存在


js的自定义对象(重点):
自定义对象的方式:在javascript中,所有的对象都是通过函数来创建
1.直接通过无参的方法来创建,这种情况下,name的信息专属于p,如果再new一个新的p,无法共享name
  function Person(){ }   //函数
  var p = new Person();  //对象
  p.name = "a";

2.通过构造方法来创建,这种情况下,name和age是属于所有对象共有的信息
  function Person(name,age){
     this.name = name;
     this.age = age;
  } 
  var p2 = new Person("",12);
  alert(p2.name);

3.通过Object来创建(不怎么用)
  var p4 = new Object();
  p4.name = "";

4.通过字面量方式来创建
   var p5 = {
    name:"小黑",
    age:18,
    say:function(){
     alert(this.name);
    }
   }
   p5.say();


尚未吃透,未完待续。。。

-----------------------------------------------分割线--------------------------------------------------------------------

js中给函数添加方法:String.prototype.reverse=function(){        }


js的DOM:

DOM:完档对象模型
<html>
  <head></head>
  <body>
    <div id="aa"></div>
    <div></div>
  </body>
</html>

document.getElementById("aa")


常用方法:
getElementById(""); 根据id找到符合条件的标签
getElementByName(""); 根据标签的name找到所有符合条件的标签<input>
getElementByTagName(""); 根据指定的标签名找到所有符合条件的标签

hasChildNodes() 查看一个节点是否拥有子节点
childNodes 获取一个节点的子节点

nodeName查看节点名称
nodeType 查看节点类型 (1表示元素节点,2表示属性节点,3表示文本节点)
nodeValue 查看节点值
firstChild 获取某个节点下的第一个节点
getAttributeNode 获取某个节点下的属性节点
getAttribute 获取某个节点下的属性节点的值
setAttribute 设置某个节点下的属性节点

注意:nodeValue属性值对于元素节点,其值是不存在的,一般用innerHTML来访问.
对于文本节点,nodeValue的值是文本值.对于属性节点,nodeValue就是属性值


掌握:
createElement 创建一个新节点
createTextNode 创建一个文本节点
appendChild 拼接子节点
insertBefore 在指定节点前面插入目标节点
removeChild 删除节点




















  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
经导师精心指导并认可、获 98 分的毕业设计项目!【项目资源】:微信小程序。【项目说明】:聚焦计算机相关专业毕设及实战操练,可作课程设计与期末大作业,含全部源码,能直用于毕设,经严格调试,运行有保障!【项目服务】:有任何使用上的问题,欢迎随时与博主沟通,博主会及时解答。 经导师精心指导并认可、获 98 分的毕业设计项目!【项目资源】:微信小程序。【项目说明】:聚焦计算机相关专业毕设及实战操练,可作课程设计与期末大作业,含全部源码,能直用于毕设,经严格调试,运行有保障!【项目服务】:有任何使用上的问题,欢迎随时与博主沟通,博主会及时解答。 经导师精心指导并认可、获 98 分的毕业设计项目!【项目资源】:微信小程序。【项目说明】:聚焦计算机相关专业毕设及实战操练,可作课程设计与期末大作业,含全部源码,能直用于毕设,经严格调试,运行有保障!【项目服务】:有任何使用上的问题,欢迎随时与博主沟通,博主会及时解答。 经导师精心指导并认可、获 98 分的毕业设计项目!【项目资源】:微信小程序。【项目说明】:聚焦计算机相关专业毕设及实战操练,可作课程设计与期末大作业,含全部源码,能直用于毕设,经严格调试,运行有保障!【项目服务】:有任何使用上的问题,欢迎随时与博主沟通,博主会及时解答。
经导师精心指导并认可、获 98 分的毕业设计项目!【项目资源】:微信小程序。【项目说明】:聚焦计算机相关专业毕设及实战操练,可作课程设计与期末大作业,含全部源码,能直用于毕设,经严格调试,运行有保障!【项目服务】:有任何使用上的问题,欢迎随时与博主沟通,博主会及时解答。 经导师精心指导并认可、获 98 分的毕业设计项目!【项目资源】:微信小程序。【项目说明】:聚焦计算机相关专业毕设及实战操练,可作课程设计与期末大作业,含全部源码,能直用于毕设,经严格调试,运行有保障!【项目服务】:有任何使用上的问题,欢迎随时与博主沟通,博主会及时解答。 经导师精心指导并认可、获 98 分的毕业设计项目!【项目资源】:微信小程序。【项目说明】:聚焦计算机相关专业毕设及实战操练,可作课程设计与期末大作业,含全部源码,能直用于毕设,经严格调试,运行有保障!【项目服务】:有任何使用上的问题,欢迎随时与博主沟通,博主会及时解答。 经导师精心指导并认可、获 98 分的毕业设计项目!【项目资源】:微信小程序。【项目说明】:聚焦计算机相关专业毕设及实战操练,可作课程设计与期末大作业,含全部源码,能直用于毕设,经严格调试,运行有保障!【项目服务】:有任何使用上的问题,欢迎随时与博主沟通,博主会及时解答。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值