jsdom

1. DOM Document Object Model(文本对象模型)

2. 节点及其类型
    element node、attribute node、text node;
    text node是element node的子节点;
    
3. JS写在什么地方
    1).HTML代码和JS代码耦合在一起
    缺点:不利于代码维护
        <button οnclick="alert('hello..')">ClickMe</button>
    2).放在html文档的最后
    缺点:不符合JS代码的习惯
    3).放在title标签后
        缺点:为加载完文档就已经执行
        应对方案:使用window.onload = funtion(){代码块}
        
4.获取节点
    对象.getElementsByTagName();
    对象.getElementById();
    对象.getElementsByName();
    返回对应对象下的元素
    
5.若HTML元素自身没有定义name属性,使用getElementsByName()对IE无效。

6.读写属性
    获得元素节点,通过节点.属性直接获取属性,
    通过节点.属性=属性值;实现属性的赋值。
        var nameNode = document.getElementById("name");
        alert(nameNode.value);
        nameNode.value="你好";
        
7.获取元素节点的所有子节点
    1).获取元素节点。
    2).利用元素节点的childNodes方法获取子节点
    var cityNode = document.getElementById("city");
    alert(cityNode.childNodes.length);//不同浏览器结果可能不同

8.获取元素节点的指定子节点
    元素.getElementsByTagName();
    
9.获取第一个和最后一个子节点
    元素.firstChild;获取第一个子节点
    元素.lastChild;获取最后一个子节点
    
10.获取文本节点
    1).获取文本元素所在节点
    2).通过firstChild获取文本节点 //因为文本节点是唯一的
    3).获取文本节点的nodeValue属性来获取文本节点的值
        var bjNode = document.getElementById("bj");
        var bjTextNode = bjNode.firstChild;
        var bjValue = bjTextNode.nodeValue;
        
    4).可以更改文本信息
        bjTextNode.nodeValue="hello";
        
11.添加事件时,方法中若还用到当前节点,使用this,不使用节点的引用。

12. /g表示全局标志

13.字符串.replace(reg, str); 将字符串中符合reg的替换成str

14.正则表达式.test(var str);返回boolean 表示是否符合表达式

15.节点的属性
    nodeName只读
    nodeType只读
    nodeValue可读可写
    
16.创建元素节点
    var liNode = docuemnt.createElement("节点名");
    创建文本节点
    var xmText = document.createTextNode("文本值");
    
    
    添加元素节点
    节点.appendChild(节点名);//添加到节点的最后一个
    
17.查看radio类型是否被选中使用checked属性
    type[1].checked;若被选中,返回true,否则返回false
    
18.button的监听事件时,若最后返回false,则不会提交。

19.替换节点
    a.找到所要替换的节点i,j
    b.找到被替换节点的父节点i.partenNode
    c.使用replaceChild(新节点,旧节点);
    
20.删除节点,同时删除子节点
    父节点.removeChild();
    
21.comfirm()弹出确认对话框,返回一个boolean类型。

22.插入节点insertBefore(新节点,位置节点);
父节点.insertBefore();

23.innerHtml属性 表示节点内的所有内容

24.使用for(){}时,若删除节点nodes[i],每次删除完之后会刷新,可能出现数组越界,应使用node[0];每次删除第一个元素,直到删除完。

25.克隆节点
    cloneNode(true);表示克隆的同时也包含其子节点
    cloneNode();克隆节点,不包含子节点
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Node.js JSDOM is a JavaScript library that allows you to run a DOM (Document Object Model) implementation in Node.js. JSDOM simulates a browser's environment, enabling you to parse and manipulate HTML/XML documents using familiar DOM APIs. You can use JSDOM to perform tasks like web scraping, unit testing, and server-side rendering. It provides a way to create a virtual DOM that you can interact with programmatically. This makes it possible to access and modify elements, handle events, and perform other actions as if you were running JavaScript in a browser. To use JSDOM in your Node.js project, you need to first install it using npm or yarn. Here's an example of how to install it: ``` npm install jsdom ``` Once installed, you can require JSDOM in your Node.js script and start using its API. Here's a basic example: ```javascript const { JSDOM } = require('jsdom'); const dom = new JSDOM('<!DOCTYPE html><p>Hello world</p>'); const document = dom.window.document; console.log(document.querySelector('p').textContent); // Output: Hello world ``` In this example, we create a new JSDOM instance with an HTML document. We can then access the `document` object to perform various DOM operations, such as selecting elements using CSS selectors. JSDOM provides many other features and options, such as loading external scripts, handling resources like images and stylesheets, and executing JavaScript within the virtual DOM. You can refer to the official documentation for more information on how to use JSDOM effectively in your Node.js projects.
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值