如何在js 文件中使用jquery

发布网友 发布时间：2022-04-22 01:12

我来回答

共4个回答

懂视网 时间：2022-05-14 21:14

这篇文章给大家分享的内容是关于如何搭建仿jQuery的骨架并测试（附代码），有一定的参考价值，有需要的朋友可以从参考一下，希望对你有所帮助。

(function(global, factory) {
 if (typeof global.document === 'undefined') {
 throw new Error('the environment must have a window Object with document !')
 }
 // 若环境存在则执行factory
 factory(global);
})(typeof window !== 'undefined' ? window : this, function (window) {
 var _mJQ = function (selector) {
 return new _mJQ.init(selector);
 }
 // 初始化
 _mJQ.init = function(selector) {
 // 进行selector匹配，比如class,attr,id等...
 if (selector === '#test') {
  const elem = document.getElementById('test')
  this.elem = elem
  return this
 }
 return this
 }
 // 让init的原型对象指向_mJQ的原型
 _mJQ.init.prototype = _mJQ.prototype = {
 // 功能
 each: function() {
  // 循环
 },
 html: function() {},
 css: function (name, value) {
  console.log(this)
  this.elem.style[name] = value
 }
 }
 // 设置contructor指向问题
 Object.defineProperty(_mJQ.prototype, 'constructor', {
 enumerable: false,
 value: _mJQ
 })
 // 挂载到window
 window.$ = window.mJQ = _mJQ;
})

测试demo地址

https://github.com/clm960227/...

测试结果

相关文章推荐：

svg中<marker>元素的使用及marker属性的介绍

JavaScript设计模式之简单介绍适配器模式

Angular表单验证的两种方法介绍

热心网友 时间：2022-05-14 18:22

1.js

其中1.html代码如下：

如要测试还需要加上jquery.js 这个可自行下载

运行后点击按钮效果如图：

下面再附上网上的一些方法：

 1、直接document.write
<script language="javascript">
   document.write("<script src='test.js'><\/script>");
</script>

2、动态改变已有script的src属性
<script src='' id="s1"></script>
<script language="javascript">
   s1.src="test.js"
</script>

3、动态创建script元素
<script>
   var oHead = document.getElementsByTagName('HEAD').item(0);
   var oScript= document.createElement("script");
   oScript.type = "text/javascript";
   oScript.src="test.js";
   oHead.appendChild( oScript);
</script>
其实原理就是利用dom动态的引入一个js到文件中来，就能和原有的js通信了。

热心网友 时间：2022-05-14 19:40

在页面开头引入jquery类库，就能用了

热心网友 时间：2022-05-14 21:15

在head标签内写入

在以后的script里就可以使用jquery了

例如：

如要选择id为oDiv的div标签，

js原生写法：

jquery写法就很简单了