js初学者
<!DOCTYPE html>
<!--
作者：zhangqiop@126.com
时间：2016-11-09
描述：js之变量和函数，自执行函数 DOM编程
js2.html
-->
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>js基础</title>
<style>
.show{
}
.hide{
display: none;
}
.gray{
color:gray;
}
.black{
color:black;
}
</style>
</head>
<body>
<!--
搜索框标签
<input type="text" class="gray" id="tip" value="请输入关键字" onfocus="Enter();" onblur="Leave();" />
-->
<!--
表单根据name获取key
<form id="F1" action="https://www.sogou.com/web?" method="POST">
<input type="text" name="query" />
<input type="submit" value="提交" />
<input type="button" value="伪提交" onclick="Foo();" />
</form>
-->
<!--
<div id='t1' class="show" name='zhangqi'>内容</div>
<div id='t2' style="width:500px;height:200px;border:2px solid #333;"></div>
<hr />
<div name='n1'>RedHat</div>
<hr />
<div name='n1'>Micosoft</div>>
<hr />
-->
<script src="js/cc.js"></script>
<script type="text/javascript">
/*
js创建搜索框，并创建事件，触发函数进行判断
function Enter(){
var id = document.getElementById('tip');
id.className = 'black';
if(id.value=='请输入关键字'||id.value.trim()==''){
id.value = ''
}
}
function Leave(){
var id = document.getElementById('tip');
var val = id.value;
if(val.length==0||id.value.trim()==''){
id.value = '请输入关键字';
id.className = 'gray';
}else{
id.className = 'black';
}
}
/*
/*
DOM编程获取表单ID并提交表单
function Foo(){
document.getElementById('F1').submit();
}
*/
/*
DOM编程获取id更改样例参数
var id2 = document.getElementById('t2');
var width = id2.style.width;
console.log(width);
id2.style.width = '100px';
parseInt('a');
*/
/*
DOM编程获取name值并更改name值
var id1 = document.getElementById('t1');
console.log(id1.getAttribute('name'));
id1.setAttribute('name','sunguoshuai');
console.log(id1.getAttribute('name'));
*/
/*
DOM编程更改标签CSS样式
var id1 = document.getElementById('t1');
id1.className = 'hide';
*/
/*
DOM编程创建标签
var link = document.createElement("a");
link.href = 'http://www.baidu.com';
link.innerText = '点我啊';
var id1 = document.getElementById('t1');
id1.appendChild(link);
var link = "<a href='http://www.baidu.com'>点击</a>"
var id1 = document.getElementById('t1')
id1.innerHTML = link;
*/
/*
DOM编程获取标签id并更改id参数
var id1 = document.getElementById('t1');
console.log(id1.innerText); DOM 获取原来的值
id1.innerText = 'zhangqi'; DOM 更改值
console.log(id1.innerHTML);
id1.innerHTML('zhangqi');
*/
/*
DOM编程获取name属性和标签属性，并更改name和所有标签参数
names = document.getElementsByName('n1'); 获取name
names = document.getElementsByTagName('div'); 获取标签
names[0].innerText = 'zhangqi';
names[1].innerText = 'zhangqi';
for (var item in names){
names[item].innerText = 'zhangqi';
}
*/
</script>
</body>
</html>
##################################################
cc.js
//alert('WelCome');
//js之变量和函数，自执行函数，匿名函数
//全局变量
//name = 'zhangqi'
//局部变量
//var name = 'zhangqi'
//函数定义，和调用，打印输出
/*
function Foo(name){
var arg2 = arguments[1];
console.log(name);
console.log(arg2);
}
Foo('zhangqi','sb')
*/
//匿名函数 将函数赋值给变量
/*
var temp = function(){
}
*/
//自执行函数
/*
(function(name,arg){
console.log(name);
console.log(arg);
})('zhangqi','sunguoshuai')
*/
//去除空白行
//var name = 'alex'
//name.trim()
//根据索引去字符串里找字符
//name.charAt(0)
//得到字符串的某一段,括号指定索引位置
//name.substring(1,3)
//查看字符串的长度
//name.length
//js声明数组
/*
var arry = [1,2,3,4]
arry.push('zhangqi');
console.log(arry);
arry.unshift('sunguoshuai')
console.log(arry);
arry.splice(1,0,'huanghaibing');
console.log(arry);
arry.splice(100,0,'zhengjinlei');
console.log(arry);
*/
//js之for循环
//循环显示key
//var arry = [11,22,33,44,55]
//var dict = {'name':'zhangqi','age':19}
/*
for (var item in arry){
console.log(item);
}
*/
//循环显示value,建议循环字典时候使用
/*
for (var item in dict){
console.log(dict[item]);
}
*/
//循环数组
/*
for (var i=0;i<arry.length;i++){
console.log(arry[i]);
}
*/
浙公网安备 33010602011771号