5.15js的初步接触

1.淘宝 购物车的 页面上会有 改变数量 就会产生 对应的价格,

    <td><input type="button" id="jian" value="-" onclick="showsum(‘-‘)"/>

    <input type="text" id="number" size="3" value="1"/>

    <input type="button" id="add" value="+" onclick="showsum(‘+‘)"/></td>
    <td>
     <input type="text"  id="sum" />
    </td>

  以上 是html 代码,

js就是 先把 number的值 取出来

function showsum(v){       先把 客户的 原始number 取出来
    var number=parseFloat(document.getElementById("number").value); 

	switch(v){
		case ‘-‘:number-=1;
		break;
		case ‘+‘:number+=1;
		break;
		}        把 计算的值 再显示 出来
document.getElementById("number").value=number;

  调用 一个 函数 计算 sum
	calprice();

	}

	function calprice(){

		var price=parseFloat(document.getElementById("price").innerHTML);/*常量 是单价*/
		这里 取出来的 是 计算过后的 value
		var number=parseFloat(document.getElementById("number").value);  

		var total=number*price;
		document.getElementById("sum").value=total;
		}

  

2.提交 一个 表单之后 会实现 跳转,

function check(){
    var yan=document.all.yan.value;// 一样的 效果
	  var yan2=document.getElementById("yan2").value;	

	if(yan==‘1234‘&&yan2==‘4567‘)
	{
		return true;
		}
		alert("错误");
	return false;

	}

</script>
<body>          如果 返回的值 是true 那么 就会实现跳转
<form onsubmit="return check();" action="打印三角形1.html">
 <div id="alipay">
     <font>请输入一下的验证码:1234</font>
    <input type="text" id="yan"/>
 <br/>
 <font>请输入一下的验证码:4567</font>
    <input type="text" id="yan2" />
     <br/>

     <input type="submit"  /> <input type="reset"  />

 </div>

  》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》

3.需要 注意的 是 input 的类型的 value 值 ,你输入的 是 属于 String 类型,需要 进行转化

	var sum2=parseFloat(document.getElementById("num2").value);

 4.使用 js 来 改变 div 元素的 style

  <input type="button" value="黑色" id="blackid" onclick="showcolor(‘b‘)" />
      <input type="button" value="蓝色" id="redid" onclick="showcolor(this)" />
  》》》》》》》》》》》》》》》》》》》》》》》》
function showcolor(se){
	             一个是 普通的 ,一个是 传入 元素 this值
	switch(se){
		case ‘b‘:document.getElementById("xiao").style.background=‘black‘;break;
	switch(se.id){
		case ‘redid‘:document.getElementById("xiao").style.background=‘blue‘;break;
		}
	}

》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》  

5.根据 时间的不同 来 改变 css背景,就是 new Date()而已

         var now=new Date();
	var hour=now.getHours();

	switch(hour){
		              这里就是 整个文档
		case ‘10‘:document.bgColor=‘red‘;break;
		}

 6. 通过 改变 标签元素的类名,来实现对 css 改变

<div onmousemove="this.className=‘over‘" onmouseout="nn" class="nn1"></div>

》》》》》》》》》》》》》》》》》》》》》》》》

 7.对于 广告的 弹窗 使用的 showModal

<input type="button" onclick="showw()" />
function showw(){
   window.showModalDialog("showmodal2.html","","dialogWidth:400px;dialogHeiht:150px;");	  使用的 window事件

	}

  

8.window 下面 有  document(整个 html 文档)

location(也就 url 有用) history

event ( 事件的 状态,比如 鼠标和键盘) 》》————————————————————————————————————还有 给开发人员用的 窗口对象,计时器setTiemout(函数,时间) alert() confirm();

showModalDialog(其中 一个模型)    open() 和close()__________________________________________________________9.document 对象 就会有很多的属性可以操作  主要是 getElById(“”)至于 ByName()主要 就是用在 checkbox()中的 全选
<a href="#" onclick="mychange(true)">全选</a>
<a href="#" onclick="mychange(false)">不选</a>

<input type="checkbox" name="love" >2 <br/>
<input type="checkbox" name="love" >23 <br/>
<input type="checkbox" name="love" >23 <br/>
<input type="checkbox" name="love" >24<br/>

function mychange(v){

	var arys=document.getElementsByName("love");
	for(var i in arys){ 也只有这个 地方会使用拉

		arys[i].checked=v; 就是一个 选中
		}

	}

  10.操作 DOM 节点目前 还没有用到, 当有而来 jq 之后,应该 就很少使用

》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》

11 。至于 操作 字符串和 字符数组 he  java 差不多

var data="宝马,丰田,大众,奔驰";

var array=data.split(",");  变成了 数组

var shujua=do.g..Name(""); 取得 了一个  对象数组

for(var i=0;i<array.length;i++){

for(var j=0;j<shujua.length;j++){

if(array[i]==shujua[j].value){

shujua[j].checked=true;

break;}

}

}

————————————————————————————————————————————————————

时间: 2024-08-03 20:00:30

5.15js的初步接触的相关文章

为什么要使用puppet 及初步接触

为什么要使用puppet 及初步接触 1.简介 云计算环境下,密度高,机器数量多,还要求弹性和伸缩性,这对于运维提出更高的要求.系统管理员需要经常安装操作系统,对系统参数进行配置和优化,对人员进行授权和定期更新公钥,对软件包进行升级,添加和配置某个服务.这些日常繁琐的任务不但单调.重复,也容易出错.为了提高效率,积累知识,不断改进,管理员一般会想到将这些任务使用脚本进行自动化,然后不断优化和改进这些脚本,可以大大提高效率.但是自己写的脚本,具有下面一些缺点: 可伸缩性是一个问题,要管理成千上万台

C#初步接触

如同非常多刚開始学习的人一样,刚接触C#的时候,也是一头雾水,学习了好长时间,都搞不清楚一些基本名称是什么.什么是C#?什么是.net?什么是visual studio?它们之间有什么关系?以下我们就从这几个问题入手,来探究C#. 关于上边的几个问题,我发现了一个神级的回答.假设我们把用开发软件比作写汉字,那么visual studio就是笔,.net 就是纸,C#就是汉字的书写规则,依次类推,我们就能够依照C#的规则,使用vs在.net上边编敲代码. 理解了这几个问题,我们就能够从C#的基础知

【Qt学习笔记】1.初步接触

一.前言 Qt是一个跨平台的C++图形面向对象的框架,今天开始学习并记录学习过程,希望通过这段时间的努力学会Qt的使用. 同时我也希望在学习的过程中对C++的各种特性有能深刻的认识. 此外,我在Qt初步的学习过程中,所用的环境应该是 VS2015 IDE 二.安装 官网下载Qt安装包和 Qt for VS addin,分别安装,并配置. 三.Hello World 接下来用Qt框架来完成第一个程序 首先打开VS,创建一个Qt工程 熟悉的C++界面,但Qt是有可视化界面的,点击解决方案管理器中的.

C语言初步接触

这几天对C语言有了初步的了解,看了不少的语法知识. #include<stdio.h> int main() { printf("hello world\n"); return 0; } 这是我接触的第一个简单的程序设计,相信大部分人都是从hello word开始的吧! 另外还接触到了变量的知识,变量的名字不要与关键词重名,这点很容易理解. 还有一个const关键词,它可以使变量在程序中保持它的初始值不变,只要把const关键词放在变量的类型前面(放在后面也是可以的)比如:

软件工程实践----初步接触软件工程的总结

这学期的软件工程课即将结束,下面我就对本学期的软件工程课做一下基本的总结. 首先,这是我学期初在阅读了相关资料后提的一些问题:http://www.cnblogs.com/bsdbch/p/4027935.html 这些问题,有的在实际的课程实践中碰到了,因此得到了更深一步的了解.比如关于如何进行需求分析.产品定位,再比如如何控制代码的质量,如何架构整体框架从而让子函数.子类变得更小.但是也有些问题,由于我们的产品没有达到用那些高级方法的高度,所以没有过多的了解.比如关于程序模块间的耦合. 下面

初步接触LVS

今天整理下思绪,定下要掌握LVS原理和使用方法.于是,看了部分关于LVS的概述和文章. 章博士在2002年写的LVS的几篇文章,在我看来,今天都值得一看.http://www.linuxvirtualserver.org/zh/lvs1.html LVS的英文官网,http://www.linux-vs.org/ 附上采访章博士的一篇老文章,看完不由竖起大拇指.https://linux.cn/article-1553-1.html 还有在看的过程中,接触到一个集群中的新概念——脑裂.有一篇文章

初步接触QT嵌入式

拿到这块板子已经有一个多月了,处理器是三星公司的S5PV210AH-A0,主频最高可达1GHz,ARM CortexTM-A8内核,v7精简指令集,512MB DDR2 RAM,4GB 8-bit eMMC,这配置是相当高了.配备7寸的LCD显示屏,外部接口有17路外部中断GPIO,4路ADC,3路UART,1路SPI,2路PWM. 首先拿到板子启动它自带的是andorid4.0系统,工作中要用的是QT,于是就折腾到内核和文件系统,学习如何下载内核和文件系统,理解板子带的demo,读配置bash

实验记录一 初步接触cortex-M3

应该说老早就在接触cortex-M3了.以前没想到会接触嵌入式,结果因为导师的缘故,在选择项目管理时,就呵呵了.不废话.搭配环境很简单,纯粹傻瓜式.可由于自己的马虎,却让自己一直困惑.记得在前段时间,不得已在实验室呆了一个通宵,也是醉了.北方的深夜是极其冷的,何况学校晚上现在还未曾供暖.最后才发现自己弄错了仿真器.贴贴撞撞下,现在也算是真正意义上跑出来第一个样例程序(右边D1测试灯闪烁).上次虽然也把程序烧进了CPU,可事实上失败的.关于CPU板卡上跳线引脚和跳线帽问题,我纠结许久后才发现跳线帽

Maven初步接触

最近随着搜资料,网上这样的字眼越来越多,我了解到这是构建项目的一种方式,于是准备简单看一下 首先粘几篇文章,作为学习的初步资料,我会根据学习过程(由易到难)合理调整他们的顺序 Maven入门 http://blog.csdn.net/prstaxy/article/details/45702225