Web API 笔记04

Web API 笔记04

创建元素的三种方式：

1. innerHTML：

    box.innerHTML = '<span> content </span>';

这种方式会覆盖掉原来的内容
常用，但不推荐创建表格
若要动态创建列表，可以通过下面的方式：

    var data = [];
    var str = '';
    str += '<ul>';
    for (var i = 0; i < data.length; i++) {
      str += '<li>' + data[i] + '</li>';
    }
    str += '</ul>'
    box.innerHTML = str;

若在新创建的标签里面注册样式，注册函数应该在标签创建之后就写
先创建，后注册

2. document.write

document.write('<span> content </span>');

不会放在script标签内，页面加载完成之前不会覆盖掉原来的内容
只能 document 调用，慎用，如果放在注册函数里面(页面加载完成后)会导致页面内容被替换

创建元素

    var result = document.createElement('div');//注意是将元素放在单引号中

只能document调用，写标签名即可，返回一个标签
只是创建，没有添加到DOM树，需要用.appenChild(result); 进行插入。

用 for in 遍历对象 ， for遍历数组

对象数组 var objArray = [{}, {}, {}, {}, {}, {},];

tips：

• textarea中的文字用value获取

    confirm('你确定要……吗？');  //返回布尔值

• 判断字符串是否为空 用字符串.length == 0; 进行判断

• 函数体内停止函数的执行，用return。

• Array.join('分隔符'); 用于把数组转换为字符串。

节点补充：

（基础方法：.children .childNode）

-存在兼容问题且不常用的：

.firstChild 第一个子节点
.lastChild 最后一个子节点

.firstElementChild  第一个子元素
.lastElementChild  最后一个子元素

（基础方法： nextSibling ， previousSibiling）
.nextElementSibling

数组常用方法,伪数组不能用：

.forEach(function (item- 数组中的每一项, index - 下标, array - 哪个数组 - 可不写){

   })// 遍历数组

.every(function (item- 数组中的每一项, index - 下标, array - 哪个数组 - 可不写){
      return 判断条件;
    }) //数组中每一个都符合条件就返回true， 必须写return, 存在短路机制。

   .some(function (item- 数组中的每一项, index - 下标, array - 哪个数组 - 可不写){
      return 判断条件;
      （比如 return item > 10; ）
    }) //数组中只要有一个符合条件就返回true， 必须写return， 短路机制。

   .map(function (item- 数组中的每一项, index - 下标, array - 哪个数组 - 可不写){

    })//返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值。

   .filterfunction(item - 数组中的每一项, index - 下标, array - 哪个数组 - 可不写){
      return 判断条件;
    } //过滤，返回符合条件的元素数组。