对于(1)中最后一个包装方式创建的是一个方法,我们必须以方法调用的方式来使用它,这和其他默认的以属性返回结果略有不同,如果有强迫症的童鞋有些伤不起,那么我们下面就把它实现为属性返回的方式:

//children是默认属性,遂起一个中文糊糊的名字 :)
HTMLElement.prototype = {
  get: function childrens(){
     var elts = [];
    for(let elt = this.firstChild;elt!=null;elt=elt.nextSibling){
      elts.push(elt);
    }
    return elts;
  }
}

my_p.childrens;

我们还可以用看上去更优雅的方式:

//在一个函数内部调用以撇清全局对象空间
(function(){
  function get_childrens(){
     var elts = [];
    for(let elt = this.firstChild;elt!=null;elt=elt.nextSibling){
      elts.push(elt);
    }
    return elts;
  }

  //甚至我们可以写一个setter方法:
  function set_childrens(new_childrens){
    //实现略 :)
  }

  if(Object.defineProperty){
    Object.defineProperty(Element.prototype,"childrens2",{
      get:get_childrens,
      set:set_childrens,
      enumerable:false,configurable:true
    });
  }
  else{
    Element.prototype.__defineGetter__("childrens2",get_childrens);
    Element.prototype.__defineSetter__("childrens2",set_childrens);
  }
})();
my_p.childrens2

javascript访问html元素的内容(2)的更多相关文章

  1. javascript访问html元素的内容(1)

    形如如下格式的html元素: <p id="my_p">I'm <strong>BIG</strong> panda!!!</p> ...

  2. jquery 与javascript关系 ①取元素 ②操作内容 ③操作属性 ④操作 样式 ⑤ 事件 点击变色

    jQuery的min版本和原版功能是一样的,min版主要应用于已经开发成的网页中,而非min版 的文件比较大,里面有整洁的代码书写规范和注释,主要应用于脚本开发过程当中. JQuery是继protot ...

  3. 2016/4/1 jquery 与javascript关系 ①取元素 ②操作内容 ③操作属性 ④操作 样式 ⑤ 事件 点击变色

    jQuery的min版本和原版功能是一样的,min版主要应用于已经开发成的网页中,而非min版 的文件比较大,里面有整洁的代码书写规范和注释,主要应用于脚本开发过程当中. JQuery是继protot ...

  4. 12.HTML DOM 允许 JavaScript 改变 HTML 元素的内容。

    1,改变 HTML 输出流 <script> document.write(Date()); </script> 2,改变 HTML 内容 <script> doc ...

  5. jQuery学习-访问设置元素内容

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  6. Jquery取得iframe中元素的几种方法Javascript Jquery获取Iframe的元素、内容或者ID

    query取得iframe中元素的几种方法 在iframe子页面获取父页面元素代码如下: $('#objId', parent.document);// 搞定... 在父页面 获取iframe子页面的 ...

  7. javascript中DOM获取和设置元素的内容、样式及效果

    getElementById() 根据id获取dom元素 没有找到则返会Null <!DOCTYPE html> <html lang="en"> < ...

  8. JavaScript HTML DOM 元素(节点)

    JavaScript HTML DOM 元素(节点) 创建新的 HTML 元素 创建新的 HTML 元素 如需向 HTML DOM 添加新元素,您必须首先创建该元素(元素节点),然后向一个已存在的元素 ...

  9. js与DOM初步:访问html元素

    1.DOM简介 DOM= Document Object Model,文档对象模型,DOM可以以一种独立于平台和语言的方式访问和修改一个文档的内容和结构.换句话说,这是表示和处理一个HTML或XML文 ...

随机推荐

  1. java虚拟机参数设置 jvm参数设置

    java进程命令行使用方式如下: java [-options] class [args...] -options 表示虚拟机的启动参数, class为带有main()函数的java类的全名称 arg ...

  2. 巨星陨落 - Jim Gary

    偶然在微软Research中搜论文时搜到了神牛Jim Gary的paper,看着照片有点眼熟,貌似在买过的哪本书中见过.于是就饶有兴致地看着Jim的生平介绍,结果-  "Dr. Gray j ...

  3. 【一天一道LeetCode】#225. Implement Stack using Queues

    一天一道LeetCode 本系列文章已全部上传至我的github,地址:ZeeCoder's Github 欢迎大家关注我的新浪微博,我的新浪微博 欢迎转载,转载请注明出处 (一)题目 Impleme ...

  4. java设计模式---三种工厂模式之间的区别

    简单工厂,工厂方法,抽象工厂都属于设计模式中的创建型模式.其主要功能都是帮助我们把对象的实例化部分抽取了出来,优化了系统的架构,并且增强了系统的扩展性. 本文是本人对这三种模式学习后的一个小结以及对他 ...

  5. pig强制转换(字符到整数):首位0怎么处理,‘01’到1的转化,

    pig支持的类型转换(cast) Pig Latin supports casts as shown in this table. from / to bag tuple map int long f ...

  6. java设计模式---桥接模式

    桥接模式的目的是把抽象和具体实现分离,其uml类图如下所示: public interface SendMessage { abstract void send(String message,Stri ...

  7. 有关Spring注解@xxx的零碎知识

     在Java的Spring开发中经常使用一些注解,例如 @XXX 等等,在网上看到收集整理碎片知识,便于懒人计划^=^... 过去,Spring使用的Java Bean对象必须在配置文件[一般为a ...

  8. 分布式进阶(二)Ubuntu 14.04下安装Dockr图文教程(一)

    当前,完全硬件虚拟化技术(KVM.Xen.Hyper-V 等)能在一个物理主机上很好地运行多个互相独立的操作系统,但这也带来一些问题:性能不佳,资源浪费,系统反应迟缓等.有时候对用户来说,完全的硬件虚 ...

  9. java 的序列化和反序列化的问题

    引言 将 Java 对象序列化为二进制文件的 Java 序列化技术是 Java 系列技术中一个较为重要的技术点,在大部分情况下,开发人员只需要了解被序列化的类需要实现 Serializable 接口, ...

  10. Leetcode_112_Path Sum

    本文是在学习中的总结,欢迎转载但请注明出处:http://blog.csdn.net/pistolove/article/details/41910495 Given a binary tree an ...