JavaScript之$符号

最新推荐文章于 2021-01-16 19:15:30 发布

ImpulsionAndpower

最新推荐文章于 2021-01-16 19:15:30 发布

阅读量1.8k

点赞数

分类专栏： JavaScript

JavaScript 专栏收录该内容

15 篇文章 3 订阅

订阅专栏

JavaScript之$符号

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

prototype.js框架
http://www.cnblogs.com/thinhunan/archive/2006/04/01/DeveloperNotesForPrototype.html

解释:

<!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>
 
 1
2
3
4
5
6
7
8
9
10
11
12
13
14

 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)
};
 
 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

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);
    }
};
 
 1
2
3
4
5
6
7
8
9
10
11
12
13
14

第一段为HTML5的代码,不是重点,不过多解释了.
第二段为JavaScript代码,
第一个window.onload() function可以执行,至于为什么是因为支持JavaScript-DOM，效果如下:
第二个window.onload() function的第一个语句可以执行,第二个语句无法执行
效果如下:

大家可能注意到了,这里我在base.js中定义了function $(id),如果没有定义了,效果如下:

why?
可以参见以上网址中的内容,这里不过多阐述了.
第三个window.onload() function中的效果如下:

至于原因图片已经给出了,没有定义Base.$，如果想要打印输出结果的话就需要在Base里面写入这个function
第四个window.onload() function中的效果如下:

ImpulsionAndpower

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
2
评论
JavaScript之$符号

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

扫一扫