javascript访问html元素的内容(2)

简介:

对于(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
相关文章
|
25天前
|
移动开发 开发者 UED
HTML5 语义元素详解
HTML5引入了诸多语义元素
WK
|
19天前
|
存储 移动开发 前端开发
HTML5新增了哪些其他元素和属性
这段文字介绍了HTML5中新增的多种元素和属性,包括页面布局元素如header、nav等,表单元素如email、tel输入框等,以及其他元素如canvas、svg等。此外,还介绍了全局及表单属性,例如contenteditable、placeholder等,这些新功能显著增强了HTML5在现代网页设计与开发中的实用性与灵活性。
WK
44 1
|
28天前
|
存储 JavaScript 前端开发
用 HTML + JavaScript DIY 渐进式延迟法定退休年龄测算器
用 HTML + JavaScript DIY 渐进式延迟法定退休年龄测算器
|
28天前
|
JavaScript 前端开发 容器
用HTML DOM实现有条件地渲染网页元素(上)
用HTML DOM实现有条件地渲染网页元素(上)
|
28天前
|
存储 JavaScript 前端开发
用HTML DOM实现有条件地渲染网页元素(下)
用HTML DOM实现有条件地渲染网页元素(下)
|
10天前
|
移动开发 JavaScript 前端开发
原生js如何获取dom元素的自定义属性
原生js如何获取dom元素的自定义属性
28 4
|
11天前
|
JavaScript
js删除数组中已知下标的元素
js删除数组中已知下标的元素
30 4
|
26天前
|
移动开发 数据安全/隐私保护 UED
HTML5 表单元素详解
HTML5 引入了新的表单元素和属性,如 `<form>、<input>、<textarea>、<select>` 和 `<button>`,以及 `required、min、max` 等属性,增强了表单的创建与交互。其中,`<input>` 支持多种类型如 `email、url、date` 等,提供了更好的用户体验和数据验证。此外,HTML5 还新增了原生表单验证功能,简化了开发流程并提升了安全性。
|
15天前
|
JavaScript 前端开发
电话号码正则表达式 代码 javascript+html,JS正则表达式判断11位手机号码
电话号码正则表达式 代码 javascript+html,JS正则表达式判断11位手机号码
44 1
|
15天前
|
JavaScript 前端开发 索引
JS 删除数组元素( 5种方法 )
JS 删除数组元素( 5种方法 )
27 1