DOM-related knowledge points and prototypes

Source: Internet
Author: User

DOM (Increase and deletion of search);
1.获取元素1.1标准DOM API document.getElementById document.getElementsByTagName document.getElementsByName document.getElementsByClassName document.querySelectorAll 1.2亲属访问 1.3属性获取 getAttribute getAttributeNode 2.获取属性值 var attrNode=node.getAttributeNode("属性名"); attrNode.nodeValue; //简化 node.gatAttribute("属性名")
Increase
1.创建 document.createElement创建元素节点 document.createTextNode创建文本节点 document.createAttribute属性节点 innerHTML innerText cloneNode 2.加入 appendChild追加到结尾处 innerHTML insertBefore将元素插入到某一个元素的前面 列:父元素.insertBefore(新元素,旧元素); //将新元素插入到旧元素的前面
Delete
 1.删除元素 removeChild removeAttributeNode 1.2删除子元素 //从node中删除一个div node.removeChild(div); //如果div变量不存在 var div=document.getElementById("..."); node.removeChild(div); //假设node节点中只有一个元素div node.innerHTML=""; 2.删除属性 **创建时,里面属性名一定要加双引号;添加时,里面的属性一定不要加双引号。 var attrNode=node.getAttributeNode("属性名");
Modify
 1.修改节点 删除节点再加入 2.修改样式 style.xxx=vvv; setAttribute; 3.修改文本 innerHTML innerText 节点操作 nodeValue 4.修改属性 .xxx=vvv setAttribute
The difference between the opposite literal and the JSON object

There are two kinds of arguments for JSON objects: one is the traditional JSON object, and the JSON protocol object that conforms to the JSON protocol requires that all property names must be quoted, indicating that all the keys of the string must be enclosed in double quotation marks 、、、 The byte points of the HTML line-wrapping are not counted

Proto

Prior to accessing the prototype, you must use the constructor to implement it, and you cannot use the instance object directly to access the prototype. Firefox's earliest Introduction to attribute Proto is to use instance object reference prototypes. But early is non-standard. This property allows you to use the instance object to directly access the prototype function person () {}//Mystic object that is Person.prototype//then only use the constructor to access it Var o=new man (); You can not use O directly to access the mysterious object//now have Proto after//o.Proto also has direct access to mysterious objects (two underscores)//Then O. Proto===person.prototype 1. A property constructor is translated into a constructor by default in the mysterious object. Indicates that the prototype was practiced with what constructor. 2. What is the use ofproto ? . You can access the prototype . Do not use an instance to modify the members of the prototype, unless specifically required in the open. Therefore, property development is less used. However, the debugging process is very convenient and easy to access the prototype to view the members. 3. What if the use of an instance in an earlier browser requires access to the prototype? You can use the instance object to access the constructor, and then use the constructor to access the prototype VAR o=new person (); O.constructor.prototype 4. If the instance inherits the property assignment from the prototype function Foo () {} foo.prototype.name= "test"; var o1=new. Foo (); var o2=new. Foo (); O1.name= "Zhang San";//instead of modifying the name in the prototype, it adds a name attribute Console.log (ol.name+ "," +o2.name ");

Inherited

1. The simplest inheritance is to impose the properties of the suppressed object on my body, then I have this member. 2. The use of prototypes can also be inherited, do not need to add any members to me, as long as the prototype has, I also have. Conclusion: By adding the methods of attribute, method and so on to the prototype of the constructor, the example of the constructor has the method.

Hybrid Inheritance Complex description

The 1.new Divtag () is used to create a Div object 2.appenTo added to an element 3. Extended img p span a 4. No matter how the method is written, the method is called, Who is this 、、、

Details

What is the difference between using point syntax to add members to a prototype and modifying a prototype object using direct substitution? 1. The prototype point has changed. 2. Constructors create objects that inherit different prototypes 3. The new object defaults to no constructor attribute note: When you modify a prototype by using the alternate method, the constructor property function person () {} is generally added. person.prototype={Constructor:person}; function person () {} var o={} O.constructor=person; Person.prototype=o; person=123; 、、、

Prototypes and inheritance

1. What is a prototype? Mysterious object for constructors is a prototype attribute, there is a constructor has a prototype property, 2. How do I use prototypes? Replace add member directly with point add Member 3. What is prototype inheritance? An instance object is a general development method that inherits from a prototype object : 4. How to implement? mixed Function Mix (O1,O2) {for (var key in O2) {O1[key]=02[key];}} Direct substitution of prototype object function Itcast () {}; itcast.prototype=[]; * Attribute Search principle 1. prototype chain 2. Attribute search principle the so-called attribute searching principle is that when an object accesses a property or method, it is first found in the current object, and if the property or method is stored in the current object, stop the lookup and use the property or method directly. If none of the current objects are present, look in the current prototype. If the property or method is stored in the current prototype object, stop the lookup and use the property or method directly. If it is not in the prototype, look it up in the prototype prototype. So back and forth, until Object.prototype did not, return to undefined. If the method is called, an error is used. The object is not a function.

DOM-related knowledge points and prototypes

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.