<!DOCTYPE>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="./js/react.js"></script>
<script src="./js/react-dom.js"></script>
<script src="./js/browser.min.js"></script>
<style>
*{ margin:0px; padding:0px;} </style>
</head>
<body>
<div id="dome"></div>
<div id="test"></div>
<script type="text/babel">
var Fix = React.createClass({
getInitialState:function(){
return{
islink:true
};
},
handleClick:function(){
//alert('这么听话啊');
this.setState({
islink:!this.state.islink
});
},
handleMouseOver:function(){
alert('喂你想干嘛?');
},
handleMouseOut:function(){
alert('吓得我一身冷汗');
},
render:function(){
return(
<div>
<h1>test</h1>
<img src="./images/jj.png" onMouseOver={this.handleMouseOver} onMouseOut={this.handleMouseOut} /> <br /><br />
<p>大家喜欢和他叫朋友吗?<b>{this.state.islink?'喜欢':'不喜欢'}</b></p>
<button onClick={this.handleClick}>有种你就点我</button>
</div>
);
}
});
ReactDOM.render(
<Fix />,
document.getElementById('dome')
);
</script>
</body>
</html>

夺命雷公狗-----React---16--事件操作事件的更多相关文章

  1. 夺命雷公狗—angularjs—18—angularjs的事件

    对于一款前端框架,提起事件,很容易让人联想到DOM事件,比如说鼠标点击以及页面滚动等.但是我们这里说的angular中的事件和DOM事件并不是一个东西. 事件的发布 我们可以通过 $emit() 以及 ...

  2. 夺命雷公狗—angularjs—16—angularjs里面的缓存

    强大的angularjs也给我们预留了一套他的缓存机智,这样在某个程度上来说还是可以做到减轻一点服务器压力的.... <!DOCTYPE html> <html lang=" ...

  3. 夺命雷公狗-----React---12--添加类和样式

    <!DOCTYPE> <html> <head> <meta charset="utf-8"> <title></ ...

  4. 夺命雷公狗-----React---11--添加css样式的方法

    <!DOCTYPE> <html> <head> <meta charset="utf-8"> <title></ ...

  5. 夺命雷公狗---微信开发17----自定义菜单的事件推送,响应菜单的CLICK

    废话不多说,index.php 代码如下所示: <?php /** * wechat php test */ //define your token require_once "com ...

  6. 夺命雷公狗---DEDECMS----31dedecms数据库创建一张表完成curl操作

    首先我们创建一张测试表,格式如下所示: 然后我们还是在plus目录下创建一个test3.php进行测试,首先写一个添加的: <?php header("Content-Type:tex ...

  7. 夺命雷公狗---微信开发59----在线点播电影网1之ckplayer播放器

    我们节课程就要开始写一个小项目了,这项目主要是写一个在线点播电影影网的,我们用到的播放器是ckplayer ckplayer基本介绍: ckplayer的全称是:超酷flv播放器,他是一款用于网页上播 ...

  8. 夺命雷公狗-----React---10--组建嵌套进行数据遍历

    先写一个组建... 然后进行嵌套.. <!DOCTYPE html> <html lang="en"> <head> <meta char ...

  9. 夺命雷公狗-----React---9--map数据的遍历

    比如我们要实现的是这种效果: 用这种方法来写,她只能写死在哪,没啥意思,所以我们定义一个数据,然后来测试下map方法对她遍历出来的数据 <!DOCTYPE html> <html l ...

  10. 夺命雷公狗-----React---8--react官方提供的组建实现双向绑定

    首先要引入她.. <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

随机推荐

  1. JS:callee属性

    函数内部属性:在函数内部,有两个特殊的对象:arguments和this. arguments有一个callee属性,该属性是一个指针,指向拥有这个arguments对象的函数. function f ...

  2. NSMutableAttributedString常用代码

    NSTextAttachment *attachment = [[NSTextAttachment alloc] init]; attachment.image = [UIImage imageNam ...

  3. ZeroMQ接口函数之 :zmq_recvmsg – 从一个socket上接收一个消息帧

    ZeroMQ 官方地址 :http://api.zeromq.org/4-1:zmq-recvmsg zmq_recvmsg(3)         ØMQ Manual - ØMQ/4.1.0 Nam ...

  4. 如何在CentOS/RHEL & Fedora上安装MongoDB 3.2

    MongoDB(名称取自"huMONGOus")是一个有着全面灵活的索引支持和丰富的查询的数据库.MongoDB通过GridFS提供强大的媒体存储.点击这里获取MongoDB的更多 ...

  5. day1 初识Linux

    linux 基础 1.Linux简介1) 掌握Linux的定义:Linux是一套免费使用和自由传播的类Unix操作系统,是一个基于POSIX和UNIX的多用户.多任务.支持多线程和多CPU的操作系统. ...

  6. <八>JDBC_重构DAO查询方法

    DAO类: import java.sql.Connection;import java.sql.PreparedStatement;import java.sql.ResultSet;import ...

  7. 12.super关键字

    ①在java中使用super关键字来调用父类的成分

  8. sql语句 之聚合函数

      聚合分析 在访问数据库时,经常需要对表中的某列数据进行统计分析,如求其最大值.最小值.平均值等.所有这些针对表中一列或者多列数据的分析就称为聚合分析. 在SQL中,可以使用聚合函数快速实现数据的聚 ...

  9. Apache Spark技术实战之8:Standalone部署模式下的临时文件清理

    未经本人同意严禁转载,徽沪一郎. 概要 在Standalone部署模式下,Spark运行过程中会创建哪些临时性目录及文件,这些临时目录和文件又是在什么时候被清理,本文将就这些问题做深入细致的解答. 从 ...

  10. PHP 使用 curl_* 系列函数和 curl_multi_* 系列函数进行多接口调用时的性能对比

    在页面中调用的服务较多时,使用并行方式,即使用 curl_multi_* 系列函数耗时要小于 curl_* 系列函数. 测试环境 操作系统:Windows x64 Server:Apache PHP: ...