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 EasyUI 组件加上“清除”功能实例详解
Apr 11 jQuery
jQuery输入框密码的显示隐藏【代码分享】
Apr 29 jQuery
jQuery滚动插件scrollable.js用法分析
May 25 jQuery
深入理解jquery的$.extend()、$.fn和$.fn.extend()
Jul 08 jQuery
jQuery UI Draggable + Sortable 结合使用(实例讲解)
Sep 07 jQuery
jQuery length 和 size()区别总结
Apr 26 jQuery
jQuery UI实现动画效果代码分享
Aug 19 jQuery
JQuery中queue方法用法示例
Jan 31 jQuery
jquery分页优化操作实例分析
Aug 23 jQuery
jquery 键盘事件 keypress() keydown() keyup()用法总结
Oct 23 jQuery
jQuery实现回到顶部效果
Oct 19 jQuery
jquery实现抽奖功能
Oct 22 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模板引擎Smarty的缓存使用总结
2014/04/24 PHP
分享下php5类中三种数据类型的区别
2015/01/26 PHP
javascript 运算数的求值顺序
2011/08/23 Javascript
纯js实现瀑布流展现照片(自动适应窗口大小)
2013/04/08 Javascript
javascript页面渲染速度测试脚本分享
2014/04/15 Javascript
自制的文件上传JS控件可支持IE、chrome、firefox etc
2014/04/18 Javascript
jQuery的position()方法详解
2015/07/19 Javascript
详解iframe与frame的区别
2016/01/13 Javascript
jQuery获取及设置表单input各种类型值的方法小结
2016/05/24 Javascript
浅析ES6的八进制与二进制整数字面量
2016/08/30 Javascript
js实现简单的网页换肤效果
2017/01/18 Javascript
微信小程序的分类页面制作
2017/06/27 Javascript
使用vue构建移动应用实战代码
2017/08/02 Javascript
nodejs更改项目端口号的方法
2018/05/13 NodeJs
在Angular项目使用socket.io实现通信的方法
2021/01/05 Javascript
python中使用OpenCV进行人脸检测的例子
2014/04/18 Python
Python入门篇之面向对象
2014/10/20 Python
编写Python小程序来统计测试脚本的关键字
2016/03/12 Python
Python矩阵常见运算操作实例总结
2017/09/29 Python
通过shell+python实现企业微信预警
2019/03/07 Python
python中元组的用法整理
2020/06/15 Python
详解基于python的全局与局部序列比对的实现(DNA)
2020/10/07 Python
Python: glob匹配文件的操作
2020/12/11 Python
开发人员所需要知道的HTML5性能分析面面观
2012/07/05 HTML / CSS
荷兰优雅女装网上商店:Heine
2016/11/14 全球购物
JD Sports意大利:英国篮球和运动时尚的领导者
2017/10/29 全球购物
美国在线自行车商店:Jenson USA
2018/05/22 全球购物
JSF面试题:Jsf中的核心类用那些?有什么作用?LiftCycle六大生命周期是什么?
2014/07/17 面试题
公务员的自我鉴定
2013/10/26 职场文书
硕士研究生自我鉴定范文
2013/12/27 职场文书
刊首寄语大全
2014/04/11 职场文书
学习十八大的心得体会
2014/09/01 职场文书
2014年机关党建工作总结
2014/11/11 职场文书
运动会报道稿大全
2015/07/23 职场文书
致运动员的广播稿
2015/08/19 职场文书
标会主持词应该怎么写?
2019/08/15 职场文书