Understanding JavaScript library (1) - first experience encapsulation to get node method

Understanding JavaScript library (1) - first experience encapsulation to get node method

1. Understanding JavaScript Libraries

       A JavaScript library is to organize various commonly used code fragments into a js file to form a package, and this package is a JavaScript library.
       There are too many excellent open source JavaScript libraries today, such as: jQuery, Prototype, Dojo, Extjs, etc. These JavaScript libraries have effectively encapsulated the most commonly used codes to facilitate development and improve efficiency.

2. First experience - encapsulating the method of obtaining nodes

HTML file

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>获取节点方法</title>
    <!--引入文件-->
    <script src="js/base.js"></script>
    <script src="js/index.js"></script>
</head>
<body>
    <div id="a">a</div>
    <input type="text" name="b" value="b" />
    <p>hellow</p>
</body>
</html>

base.js file

/**
 * Author pangtong
 */

/**
 * 获取节点方法
 */

//函数式
function getId(id){
    return document.getElementById(id);
}
function getName(name){
    return document.getElementsByName(name);
}
function getTag(tag){
    return document.getElementsByTagName(tag);
}

//对象式
var El = {
    getId:function (id){
        return document.getElementById(id);
    },
    getName:function (name){
        return document.getElementsByName(name);
    },
    getTag:function (tag){
        return document.getElementsByTagName(tag);
    }
};

index.js file

/**
 * Author pangtong
 */
window.onload = function(){
    console.log(getId('a'));
    console.log(getName('b')[0]);
    console.log(getTag('p')[0]);
    console.log(El.getId('a'));
    console.log(El.getName('b')[0]);
    console.log(El.getTag('p')[0]);
}

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=325496679&siteId=291194637