javascript 单叹号 javascript $符号

转载

数据探索先锋 2023-06-09 22:46:58

文章标签 javascript 单叹号 javascript dom 符号 html 文章分类 JavaScript 前端开发

JavaScript之$符号

前些天不小心用到了$符号,所以这里就来解释一下。
定义：
$$()这个方法是在DOM中使用过于频繁的document.getElementById()方法的一个便利的简写,就像这个DOM方法一样,这个方法返回参数传入的id的那个参数。But比起DOM中的方法,青出于蓝而胜于蓝.你可以传入多个id作为参数然后$()返回一个带有所有要求的元素的一个Array对象.

解释:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8"/>
        <title>JackDan9 and Page</title>
        <script type="text/javascript" src="js/base.js"></script>
        <script type="text/javascript" src="js/demo.js"></script>
    </head>
    <body>
        <div id="box">id</div>
        <input type="radio" name="sex" value="男" checked="checked"/>
        <p>Blog</p>
    </body>
</html>

window.onload = function () {
    console.log(document.getElementById('box').innerHTML);
    console.log(document.getElementsByName('sex')[0].value);
    console.log(document.getElementsByTagName('p')[0].innerHTML)
};
window.onload = function () {
    console.log($('box').innerHTML);
    console.log($('sex')[0].value)
};
window.onload = function () {
    console.log(Base.$('box').innerHTML);
    console.log(Base.$$('sex')[0].value);
	console.log(Base.$$$('p')[0].innerHTML)
};

window.onload = function () {
    console.log(Base.getId('box').innerHTML);
    console.log(Base.getName('sex')[0].value);
    console.log(Base.getTagName('p')[0].innerHTML)
};

function $(id) {
    return document.getElementById(id);
}
var Base = {
    getId: function(id) {
        return document.getElementById(id)
    },
    getName: function(name) {
        return document.getElementsByName(name)
    },
    getTagName: function(tag) {
        return document.getElementsByTagName(tag);
    }
};