学习总结javascript和ajax,php,和css
1,javascript
1,js可以获取和修改html的属性和内容:
通过什么获取?
window.onload=function{
document.getElementById("xxx") }
此外还有以下方式:
通过ID获取(getElementById)
通过name属性(getElementsByName)
通过标签名(getElementsByTagName)
通过类名(getElementsByClassName)
获取html的方法(document.documentElement)
获取body的方法(document.body)
通过选择器获取一个元素(querySelector) //比如var x = document.forms["myForm"]["fname"].value;表单下面的name=fname的元素
通过选择器获取一组元素(querySelectorAll) 修改元素属性或者内容
window.onload=function{
document.getElementById("xxx").innerHTML="xxx"; //改内容
var x=document.getElementById("ccc").style.color; //获取某元素的颜色属性 }
2,js可以直接输出html内容或者显示警示框
alert ("hehe");
document.write("<p>hehe</p>");
3 ,js可以和用户互动,基本上就是表单的应用,和获取html元素差不多,唯一要注意的是获取用户输入:
var x=document.getElementById("demo").value;
4,js定义事件:
document.getElementById(imgid).onclick=function(){
xxxx
}
//定义当某个id=imgid元素被点击的时候,xxx
详细的事件句柄:
| 属性 | 当以下情况发生时,出现此事件 | FF | N | IE |
|---|---|---|---|---|
| onabort | 图像加载被中断 | 1 | 3 | 4 |
| onblur | 元素失去焦点 | 1 | 2 | 3 |
| onchange | 用户改变域的内容 | 1 | 2 | 3 |
| onclick | 鼠标点击某个对象 | 1 | 2 | 3 |
| ondblclick | 鼠标双击某个对象 | 1 | 4 | 4 |
| onerror | 当加载文档或图像时发生某个错误 | 1 | 3 | 4 |
| onfocus | 元素获得焦点 | 1 | 2 | 3 |
| onkeydown | 某个键盘的键被按下 | 1 | 4 | 3 |
| onkeypress | 某个键盘的键被按下或按住 | 1 | 4 | 3 |
| onkeyup | 某个键盘的键被松开 | 1 | 4 | 3 |
| onload | 某个页面或图像被完成加载 | 1 | 2 | 3 |
| onmousedown | 某个鼠标按键被按下 | 1 | 4 | 4 |
| onmousemove | 鼠标被移动 | 1 | 6 | 3 |
| onmouseout | 鼠标从某元素移开 | 1 | 4 | 4 |
| onmouseover | 鼠标被移到某元素之上 | 1 | 2 | 3 |
| onmouseup | 某个鼠标按键被松开 | 1 | 4 | 4 |
| onreset | 重置按钮被点击 | 1 | 3 | 4 |
| onresize | 窗口或框架被调整尺寸 | 1 | 4 | 4 |
| onselect | 文本被选定 | 1 | 2 | 3 |
| onsubmit | 提交按钮被点击 | 1 | 2 | 3 |
| onunload | 用户退出页面 | 1 | 2 | 3 |
5,ajax异步,
//创建xmlhttp(是XMLHttpResquest的实例)
function xxxXxx(){
if (window.XMLHttpRequest)
{
// IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
xmlhttp=new XMLHttpRequest();
}
else
{
// IE6, IE5 浏览器执行代码
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
//创建在服务器响应以后执行的函数
xmlhttp.onreadystatechange=function()
{
if(xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;//服务端的echo也就是responseText
}
}
//向服务器上的文件发送请求,请注意,这个请求的参数,参数是一个键值对,q=str,这也服务端解析请求的依据;后边包含了str,也就是下拉列表中的内容
xmlhttp.open("GET","xxx.php?q="+str,true);//js会请求服务器调用xxx.php,php会自己用$_GET()解析url里附带的信息:q=str
xmlhttp.send();
}
2,php
(1)php脚本可以用<?php xxx ?>这样的格式封装,然后放在html里,而且同一个页面中不同的脚本变量可以共用。不同的页面要提前引用一下:“includexxx.php”假设php脚本嵌入在html页面中在用户的浏览器中打开,用谷歌f12调试时,php代码是不会显示出来的,不过大家一般都不这么用。
(2)某个php文件中的echo输出就是请求的返回值。
(3)php的$_GET和$_POST两个超全局变量可以和前端的js或者表单实现交互。当然前端数据要和php对应起来。 (4)基本语法,数据库等操作不多赘述
3,css
Css属性和设置比较多,仅列出部分,
(1)定位,网格和排版:
display:grid网格布局;position:绝对或者相对位置;float浮动;width宽度;height高度;-webkit-box-flex:2.0 (仅限谷歌)box自适应。
(2)文字
font-size:字体大小;color字体颜色;line-height:每行的行距;transform scale(1,2)水平和垂直拉伸;font-weight加粗;text-align水平对齐方式;
(3)颜色:
background-color背景颜色;border-color边框颜色;颜色的单位3种:直接写颜色对应的英文名,#fff,rgb(255,255,255)
(4)动画:
@keyframes+functionname,配合animation定义函数名字和应用的块。
4,mysql
(1)mysql可视化操作
(2)sql语句:desc表示降序排列,大到小;acs表示升序排列,从小到大排列;
(3)数据库索引,有索引表示数据库查询操作会更快,但是插入操作相应会变慢.
学习总结javascript和ajax,php,和css的更多相关文章
- 最新JavaScript、Ajax典藏级学习资料下载分类汇总 (2011年12月21日更新)
其他网站开发相关资料 超强HTML和xhtml,CSS精品学习资料下载汇总 最新htm ...
- 掌握 Ajax,第 2 部分: 使用 JavaScript 和 Ajax 发出异步请求
转http://www.ibm.com/developerworks/cn/xml/wa-ajaxintro2/ 掌握 Ajax,第 2 部分: 使用 JavaScript 和 Ajax 发出异步请求 ...
- jQuery与JavaScript与ajax三者的区别与联系(转)
原文链接: https://blog.csdn.net/qq_43154385/article/details/85003484 通过阅读,对于三者关系有一个比较清晰的认知,对于后期深入学习大有裨益 ...
- javascript的ajax
AJAX 一 AJAX预备知识:json进阶 1.1 什么是JSON? JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式.JSON是用字符串来表示Javas ...
- 【JavaScript】--ajax
1 什么是AJAX AJAX(Asynchronous Javascript And XML)翻译成中文就是“异步Javascript和XML”.即使用Javascript语言与服务器进行异步交互,传 ...
- 初识JavaScript,Ajax,jQuery,并比较三者关系
一.基本认识 1.JavaScript 定义: javaScript的简写形式就是JS,是由Netscape公司开发的一种脚本语言,一种广泛用于客户端Web开发的脚本语言,常用来给HTML网页添加动态 ...
- JavaScript实现Ajax小结
置顶文章:<纯CSS打造银色MacBook Air(完整版)> 上一篇:<TCP的三次握手和四次挥手> 作者主页:myvin 博主QQ:851399101(点击QQ和博主发起临 ...
- Javascript and AJAX with Yii(在yii 中使用 javascript 和ajax)
英文原文:http://www.yiiframework.com/wiki/394/javascript-and-ajax-with-yii /*** http://www.yiiframework. ...
- JavaScript和ajax 跨域的案例
今天突然想看下JavaScript和ajax 跨域问题,然后百度看了一下,写一个demo出来 <!DOCTYPE html> <html xmlns="http://www ...
随机推荐
- zabbix 主动模式和被动模式说名
一.zabbix agent主动模式与被动模式的区别 zabbix agent的运行模式有以下两种:1.被动模式:此模式为zabbix默认的工作模式,由zabbix server 向zabbix ag ...
- 步步深入:MySQL架构总览->查询执行流程->SQL解析顺序(转)
文章转自 http://www.cnblogs.com/annsshadow/p/5037667.html https://www.cnblogs.com/cuisi/p/7685893.html
- Java面试准备之数据库
一.考察点 1.联结 1.1 联结的概念: 简单的说,联结是一种机制,用来在一条SELECT语句中关联表,因此称之为联结. 1.2 联结的分类 注意:联结并不代表只有使用join关键字的才算是联结,w ...
- Linux Crontab Shell脚本实现秒级定时任务
一.编写Shell脚本crontab.sh #!/bin/bash step=1 #间隔的秒数,不能大于60 for (( i = 0; i < 60; i=(i+step) )); do $( ...
- Spring 使用AOP——xml配置
目录 AOP介绍 Spring进行2种实现AOP的方式 导入jar包 基于schema-based方式实现AOP 创建前置通知 创建后置通知 修改Spring配置文件 基于schema-based方式 ...
- python 必学模块collections
包含的主要功能如下 查看collections 的源码我们可以看到其为我们封装了以下的数据结果供我们调用 __all__ = ['deque', 'defaultdict', 'namedtuple' ...
- EQueue
EQueue 2.3.2版本发布(支持高可用) - dotNET跨平台 - CSDN博客https://blog.csdn.net/sD7O95O/article/details/78097193 E ...
- 关于vue打包是因代码校验报错
单个文件中: 1./* eslint - disable */ 2./* eslint-disable no-new */ 当然也支持全局: 3.bulid > webpack.base.con ...
- C# Note36: .NET unit testing framework
It’s usually good practice to have automated unit tests while developing your code. Doing so helps y ...
- android调用plus报错plus is not defined
由于plus 加载需要时间,我们使用plus 的时候应该提前判断是否已经加载好,添加监听 document.addEventListener("plusready",functio ...