React中jquery引用的实现方法


Posted in jQuery onSeptember 12, 2017

在React中引用Jquery比较好玩,获取元素的数据更多

1.引入方法举例:

import $ from 'jquery';

import { Button } from 'antd';

class testJquery extends React.Component {

constructor(props) {


super(props);



this.selectElement = this.selectElement.bind(this);


}


render() {



return(




<div>





<Button onClick={this.selectElement}>点击一下</Button>





<h4 className="text">这是:12</h4>




</div>



);


}


selectElement() {



console.log('text对象:',$('.text'));



console.log('text中的值:',$('.text')[0].textContent);


}

}

export default testJquery;

2.界面样式

React中jquery引用的实现方法

3. 控制台打印结果

React中jquery引用的实现方法

 4.text对象部分属性

React中jquery引用的实现方法

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

jQuery 相关文章推荐
利用jquery去掉时光轴头尾部线条的方法实例
Jun 16 jQuery
jquery一键控制checkbox全选、反选或全不选
Oct 16 jQuery
jQuery实现打开网页自动弹出遮罩层或点击弹出遮罩层功能示例
Oct 19 jQuery
JQuery元素快速查找与操作
Apr 22 jQuery
jquery UI实现autocomplete在获取焦点时得到显示列表功能示例
Jun 04 jQuery
JQuery实现简单的复选框树形结构图示例【附源码下载】
Jul 16 jQuery
jQuery Ajax async=&gt;false异步改为同步时,解决导致浏览器假死的问题
Jul 22 jQuery
jQuery pager.js 插件动态分页功能实例分析
Aug 02 jQuery
基于jQuery实现挂号平台首页源码
Jan 06 jQuery
jQuery操作元素的内容和样式完整实例分析
Jan 10 jQuery
jQuery实现的分页插件完整示例
May 26 jQuery
jQuery实现广告显示和隐藏动画
Jul 04 jQuery
jQuery+vue.js实现的九宫格拼图游戏完整实例【附源码下载】
Sep 12 #jQuery
jQuery实现用户信息表格的添加和删除功能
Sep 12 #jQuery
解决jquery appaend元素中id绑定事件失效的问题
Sep 12 #jQuery
JS和jQuery通过this获取html标签中的属性值(实例代码)
Sep 11 #jQuery
利用JQuery操作iframe父页面、子页面的元素和方法汇总
Sep 10 #jQuery
jQuery事件对象的属性和方法详解
Sep 09 #jQuery
详解jquery插件jquery.viewport.js学习使用方法
Sep 08 #jQuery
You might like
PHP array_flip() 删除重复数组元素专用函数
2010/05/16 PHP
PHP 获取指定地区的天气实例代码
2017/02/08 PHP
Alliance vs Liquid BO3 第三场2.13
2021/03/10 DOTA
一个对于js this关键字的问题
2007/01/09 Javascript
javascript forEach通用循环遍历方法
2010/10/11 Javascript
js实现网站首页图片滚动显示
2013/02/04 Javascript
『jQuery』取指定url格式及分割函数应用
2013/04/22 Javascript
使用js完成节点的增删改复制等的操作
2014/01/02 Javascript
Javascript动态引用CSS文件的2种方法介绍
2014/06/06 Javascript
jQuery插件MixItUp实现动画过滤和排序
2015/04/12 Javascript
jqGrid 学习笔记整理——进阶篇(一 )
2016/04/17 Javascript
vuejs父子组件通信的问题
2017/01/11 Javascript
详解angularjs的数组传参方式的简单实现
2017/07/28 Javascript
如何理解Vue的作用域插槽的实现原理
2017/08/19 Javascript
小程序如何支持使用 async/await详解
2019/09/12 Javascript
Python实现简单截取中文字符串的方法
2015/06/15 Python
Python切换pip安装源的方法详解
2016/11/18 Python
详解Python 模拟实现生产者消费者模式的实例
2017/08/10 Python
python利用有道翻译实现&quot;语言翻译器&quot;的功能实例
2017/11/14 Python
Python基于Tkinter模块实现的弹球小游戏
2018/12/27 Python
python处理DICOM并计算三维模型体积
2019/02/26 Python
python基础梳理(一)(推荐)
2019/04/06 Python
python日期相关操作实例小结
2019/06/24 Python
python已协程方式处理任务实现过程
2019/12/27 Python
Python super()方法原理详解
2020/03/31 Python
python异常处理之try finally不报错的原因
2020/05/18 Python
使用css创建三角形 使用CSS3创建3d四面体原理及代码(html5实践)
2013/01/06 HTML / CSS
全球速卖通俄罗斯站:AliExpress俄罗斯
2019/06/17 全球购物
Jack Rogers官网:美国经典的女性鞋靴品牌
2019/09/04 全球购物
指针和引用有什么区别
2013/01/13 面试题
高中生校园生活自我评价
2013/09/19 职场文书
最新的互联网创业计划书
2014/01/10 职场文书
暑假社会实践证明格式
2014/10/28 职场文书
挂职个人工作总结
2015/03/05 职场文书
2016年五一国际劳动节活动总结
2016/04/06 职场文书
动画电影《龙珠超 超级英雄》延期上映
2022/03/20 日漫