学习总结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 ...
随机推荐
- 转://ORA-00603,ORA-27501,ORA-27300,ORA-27301,ORA-27302故障案例一则
背景介绍: 这是一套windows的rac系统.数据库后台日志报ORA-00474:SMON process terminated with error.接着报ORA-00603,ORA-27501, ...
- 利用BeEF REST API自动化控制僵尸主机
本文首发Freebuf,属于原创奖励计划,未经许可禁止转载. http://www.freebuf.com/articles/network/137662.html 一. 前言 关于BeEF,不再多介 ...
- 偶现bug如何处理?
请先允许我对此类bug进行吐槽,相信做测试的同学都碰见过这种bug! 我们在测试过程中经常会碰见一类很头疼的bug,就是偶现性的bug,所谓偶现性,是相对于必现而言,这类bug有些可以有重现路径,但是 ...
- 《Java2 实用教程(第五版)》教学进程
目录 <Java2 实用教程(第五版)>教学进程 预备作业1:你期望的师生关系是什么? 预备作业2 :学习基础和C语言基础调查 预备作业3:Linux安装及命令入门 第一周作业 第二周作业 ...
- 安装软件the error code is 2203解决方法
win10安装mysql5.7的时候弹出这个2203错误,记录一下. 解决方法: 按照下面路径,去掉只读解决了.
- 错误:set Assigning an instance of 'esri.***' which is not a subclass of 'esri.***‘
1. 出现 set Assigning an instance of 'esri.***' which is not a subclass of 'esri.***‘的错误原因 是 因为没有找见 ...
- VSCode 必装的 10 个高效开发插件
本文介绍了目前前端开发最受欢迎的开发工具 VSCode 必装的 10 个开发插件,用于大大提高软件开发的效率. VSCode 的基本使用可以参考我的原创视频教程「VSCode 高效开发必装插件」. V ...
- ORM框架SQLAlchemy
SQLAlchemy orm英文全称object relational mapping,就是对象映射关系程序,简单来说就是类似python这种面向对象的程序来说一切皆对象,但是使用的数据库却都是关系型 ...
- 前端cookie操作用到的一些小总结
前后端完全分离的是目前web开发的大趋势,包括现下流行的前端框架的应用vue,angular,在不同页面跳转时,前端需要对用户登录状态进行判断,拿到用户的id,除了Ajax从服务器端获取数据外,对co ...
- Python基础知识3-函数、参数及参数解构
函数 函数定义.调用 函数参数 函数参数默认参数 函数参数默认值 可变参数 keyword-only参数 可变参数和参数默认值 函数参数 参数解构 练习: #编写一个函数,能够接受至少2个参数 def ...