1. jQuery 的别名
-
用途:
$
是 jQuery 的核心标识符,用于快速选择 DOM 元素或调用 jQuery 方法。// 选择所有 <div> 元素并隐藏 $('div').hide(); // 发起 AJAX 请求 $.get('/api/data', response => console.log(response));
-
注意:虽然 jQuery 使用率下降,但在遗留项目中仍常见。
2. Vue 实例的特殊属性
-
用途:Vue 在实例中通过
$
前缀暴露内置方法和属性,以区分用户自定义内容。export default {mounted() {this.$refs.myButton.click(); // 访问 DOM 元素this.$emit('event-name'); // 触发自定义事件console.log(this.$router); // 访问 Vue Router 实例} }
-
常见属性:$mount('#root')(挂载),
$refs
,$emit
,$router
,$store
(Vuex)等。
3. 模板字符串中的变量插值(ES6+)
-
用途:在反引号(
)包裹的模板字符串中,
${}` 用于嵌入变量或表达式。const name = 'Alice'; console.log(`Hello, ${name}!`); // 输出:Hello, Alice!
-
注意:
$
需与{}
结合使用,单独$
无特殊意义。
4.在前端开发中,$符号主要用于jQuery和Vue.js中,具有不同的用途和含义。
jQuery中的$符号
在jQuery中,$符号是一个函数,用于选择DOM元素。它可以通过CSS选择器、XPath或HTML元素来匹配目标元素,从而获取所需的DOM元素。具体用法如下:
- $(expression):通过CSS选择器、XPath或HTML元素表达式来匹配目标元素。
- $(element):直接获取一个特定的DOM元素,如document、location、form等。
Vue.js中的$符号
在Vue.js中,$符号用于访问实例的属性和方法,以及进行组件间的通信。具体用途包括:
- 实例属性:如data、props等,用于访问实例的数据和属性。
- 实例方法:如emit、on等,用于处理事件相关的操作。
- 全局属性和方法:如root、parent等,用于访问组件树中的其他实例。
- 插件和库:如router、store等,用于访问和操作Vue Router和Vuex等插件。
5.在jQuery中,$.和$()是两种不同的用法,具有不同的含义和功能。
(1)$.:$.是jQuery对象的静态成员访问方式,常用于调用jQuery的全局方法或属性。$是jQuery库的别名,通过$符号可以访问jQuery对象的静态成员。
例如,$.ajax()是一个全局的静态方法,用于发起Ajax请求。$.each()用于迭代集合或数组的方法。$.fn是一个对象,包含了jQuery原型(prototype)上的方法和属性。
总之,$.表示直接访问jQuery库的全局成员,无需创建jQuery对象。
(2)$():$()是jQuery的选择器函数,用于创建一个jQuery对象,通过选择器来选取匹配的HTML元素。
例如,$('selector')根据选择器选择匹配的元素,并将它们封装成一个jQuery对象。通过这个对象,可以使用jQuery提供的方法来操作选中的元素。
``$()`函数也可以接受其他参数,如HTML字符串、DOM元素、函数等,用于创建或包装成jQuery对象。
通过$()函数创建的jQuery对象可以调用jQuery提供的实例方法,如.css()、.addClass()等,来操作选中的元素。
总结:
$.用于访问jQuery库的静态成员,调用全局方法和属性。
$()用于创建jQuery对象,通过选择器选取匹配的元素或其他参数创建jQuery对象,然后调用jQuery提供的实例方法来操作选中的元素。