Prototype使用$()函数

最新推荐文章于 2022-07-09 18:00:00 发布
最新推荐文章于 2022-07-09 18:00:00 发布
阅读量691 收藏
点赞数
分类专栏： Prototype 文章标签： Prototype javascript web开发
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/owen_william/article/details/51344617
版权

1.前言

Prototype库提供了一个简化的访问方式，就是获取id为tagName的HTML元素。

1)        $(String tagName):直接获取id为tagName的HTML元素。

2)        $(String tagName1,StrigtagName2):获取id为tagName1、tagName2的HTML元素数组。

注：$()函数除了可以接受一个HTML元素的ID之外，还可以接受多个ID。如果为该函数传入多个HTML元素的ID，该函数将返回多个ID对应的HTML元素的数组。

2.例子

看下面简单的代码。

 <!DOCTYPE html>
<html>
<head>
	<meta name="author" content="OwenWilliam" />
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title> $()函数 </title>
</head>
<body>
<script src="../prototype.js" type="text/javascript">
</script>
<script type="text/javascript">
function clickHandler()
{
	// 访问a2元素
	$("out").innerHTML += $("a2").value;
}
</script>
<input id="a1" name="a2" type="text" value="第一个文本框"/><br />
<input id="a2" name="a1" type="text" value="第二个文本框"/><br />
<input οnclick="clickHandler();" type="button" value="显示" />
<div id="out" style="font-weight:bold;"></div>
</body>
</html>

3.运行结果



Owen William
关注
专栏目录
Prototype 学习 工具函数学习($A方法)
09-05
在Prototype中，`$A`是一个非常实用的工具函数，它的主要作用是将一个类数组对象转换成真正的Array对象。这个函数的重要性在于，它能够处理那些具有索引但不是真正数组的对象，如DOM方法返回的NodeList。 `$A`函数...
Prototype框架之$$函数
cheneyforever的专栏
05-09 159
$$是prototype框架里的一个亮点了，也是一种快捷方式，通过它可以根据css样式选择页面中的元素，它支持以下几种css选择方式。 $支持的css选择符 元素标签(tag)。$$("li") 元素ID,id前要加#。$$("#div_test") css类，类名前加.。$$(".style1") 元素是否具有某个属性。$$("a[class]") 元素...
Prototype 学习——工具函数学习($方法)
Challenge Next Challenge
07-11 941
 $ $$ $A $F $H $R $w Try.these document.getElementsByClassName $方法——被成为瑞士军刀（Swiss Army knife）If provided with a string, returns the element in the document with matching ID;
了解JavaScript中的prototype （实例）
Just Code
04-25 315
JS中的phototype是JS中比较难理解的一个部分。javascript的方法可以分为三类：类方法，对象方法，原型方法。 例子： function People(name) { this.name=name; //对象方法 this.Introduce=function(){ alert("My name is "+this.name); } } //类方法...
prototype $() 函数
prototype
08-08 196
$(id) → Element$(id...) → [Element…] id (String | Element) – DOM节点或引用节点的ID字符串. prototype如果提供一个字符串，返回文档中的元素匹配的ID，否则返回传入的元素。 注意到在任意数量的参数。如果一个参数返回一个元素，否则返回一个数组元素。 由该函数返回的所有元素都是元素的实例方法“扩
JQuery部分功能底层实现
越陌度阡
06-09 692
// 为指定对象添加指定方法与执行方法后的回调函数(对象、方法、回调函数) function myAddEvent(obj, sEv, fn) { // 兼容IE写法,attachEvent会把绑定函数的this换成window if (obj.attachEvent) { // 在 attachEvent 方法中，事件是以 “on” 开头的 ob......
Firefox/Chrome/Safari的中可直接使用$/$$函数进行调试
09-05
IE9 和 Opera 似乎没有提供这样的内置函数，这可能是由于它们的开发者工具在那时候可能还没有实现这些功能，或者是出于与其他库（如 Prototype 或 jQuery）保持兼容性的考虑，因为这两个库也使用 $ 符号作为其主要...
Prototype 工具函数 学习
09-05
Prototype 是一个广泛使用的 JavaScript 库，它为原生 JavaScript 对象添加了许多实用的功能，包括一些工具函数，使得开发更加高效和简洁。在这个话题中，我们将深入探讨 `$H`、`$R`、`Try.these` 以及 `document....
Prototype 学习 工具函数学习($方法)
09-05
$方法——被成为瑞士军刀$方法使用技巧。
Prototype 学习 工具函数学习($w,$F方法)
09-05
### Prototype JS 中的工具函数：$w 和 $F 方法详解 #### 一、概述 在JavaScript库Prototype中，提供了一系列方便实用的工具函数，用于简化常见的编程任务。本文将详细介绍两个常用的工具函数：`$w` 和 `$F` 的...
$.prototype.on方法－学习笔记
caomingwumr8的博客
10-06 389
$(parent,selected).on(events,handle),另一种$(parent).on(events,selected,handle);这种写法对动态添加元素事件有效。如: 圣诞主题 ul{ background-color:red;} li{ background-color:yellow;}
es6 原型继承
qq_44891434的博客
12-17 239
es6 原型继承 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-e...
vue.use和vue.prototype.$xxx的区别
热门推荐
a125129167的博客
09-05 1万+
很多人其实都在问,vue.use和vue.prototype.$xxx的区别，下面来分别了解一下这两个的使用内容及步骤,= 1.vue.use 先看一下vue中文文档是怎么讲解这个属性的 官方文档说的是，通过vue.use引入的插件，可以理解为自己定义的方法或者引入的Eelment ui组件,可能很多人不理解Element ui怎么和vue.use插件扯上关系了，没关系，我们现在vsco...
prototype中$的使用
weixin_34144848的博客
11-15 137
最近项目用到了prototype所以来小研究一下，第一讲$的使用，见代码： <!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <htmlxmlns="http://w...
Js中prototype 、$.fn、“：”、jQuery.prototype.init 是什么，表达什么意思
qq_40138785的博客
09-12 3045
一、prototype 属性 例： &lt;script type="text/javascript"&gt; function employee(name,job,born) { this.name=name; this.job=job; this.born=born; } var bill=new employee("Bill Gates","Engineer",1985); em...
prototype笔记(一)----使用$A()函数
dodomail的专栏
06-12 163
使用$A()函数 $A()函数能把它接收到的单个的参数转换成一个Array对象。 这个方法，结合被本类库扩展了的Array类，能方便的把任何的可枚举列表转换成或拷贝到一个Array对象。一个推荐的用法就是把DOM Node Lists转换成一个普通的Array对象，从而更有效率的进行遍历，请看下面的例子。 [code="js"] function showOptions(){ v...
理解jquery的$.extend()、$.fn和$.fn.extend()
楠人的博客-随风而过
11-18 1024
 jQuery为开发插件提拱了两个方法，分别是： jQuery.fn.extend(); jQuery.extend(); jQuery.fn jQuery.fn = jQuery.prototype = { 　　　init: function( selector, context ) {//…. //…… }; 原来 jQuery.fn = jQuery.prototype.对p
Page.prototype-$emit()
费小存的博客
05-28 710
Page.prototype function Page(){} $.extend(Page.prototype,{ init: function(){ this.bindEvents() }, bindEvents: function(){ var btn = $('#btn'); btn.click(function...
函数的prototype属性（原型对象）
JJ_Smilewang的博客
07-09 2556
每个函数都有一个prototype属性，它默认是一个空的Object的实例对象（即称为：原型对象），而原型对象中有一个属性constructor，它指向函数对象。这说明(构造)函数和它的原型对象相互引用。Type表示的是构造函数，它其中有个属性prototype，而这个属性指向这个函数的prototype对象，而这个对象有个属性constructor，它是指回这个构造函数Type的，即是相互引用关系。① 每个函数function都有一个prototype，即显式原型 ② 每个实例对象都有一个__prot
Vue.prototype.$target
最新发布
07-16
Vue.prototype.$target 是一个自定义的属性，它是 Vue 实例的原型上的一个属性。通过 Vue.prototype.$target，我们可以在 Vue 实例中访问到该属性。 具体来说，Vue.prototype 是 Vue 构造函数的原型对象，它包含了一些在 Vue 实例中可以共享的方法和属性。通过在 Vue.prototype 上添加属性或方法，我们可以在所有的 Vue 实例中访问到它们。 $target 是一个自定义的属性名，你可以根据自己的需求来命名。它可以用来存储一些全局的数据或者状态，供应用程序的各个组件访问和使用。 举个例子，假设我们在 Vue 实例的创建过程中通过 Vue.prototype.$target = 'example' 添加了 $target 属性，那么在组件中就可以通过 this.$target 来访问到这个属性的值。这样就实现了在不同组件之间共享数据的目的。 需要注意的是，在使用 Vue.prototype 扩展原型对象时，需要在创建 Vue 实例之前进行扩展，否则在创建实例后再进行扩展将不会生效。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值