慕课网

精品课程 JavaScript入门篇

JavaScript入门篇

最热最新

lxl820813

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" Content="text/html; charset=utf-8" />
<title>javascript</title>
<style type="text/css">
body{font-size:12px;}
#txt{
height:400px;
width:600px;
border:#333 solid 1px;
padding:5px;}
p{
line-height:18px;
text-indent:2em;}
</style>
</head>
<body>
<h2 id="con">JavaScript课程</H2>
<div id="txt">
<h5>JavaScript为网页添加动态效果并实现与用户交互的功能。</h5>
<p>1. JavaScript入门篇，让不懂JS的你，快速了解JS。</p>
<p>2. JavaScript进阶篇，让你掌握JS的基础语法、函数、数组、事件、内置对象、BOM浏览器、DOM操作。</p>
<p>3. 学完以上两门基础课后，在深入学习JavaScript的变量作用域、事件、对象、运动、cookie、正则表达式、ajax等课程。</p>
</div>
<form>

<input type="button" value="改变颜色" onclick="changecolor()">
<input type="button" value="改变宽高" onclick="changewh()">
<input type="button" value="隐藏内容" onclick="changehidden()">
<input type="button" value="显示内容" onclick="changedisplay()">
<input type="button" value="取消设置" onclick="cancel()">
</form>
<script type="text/javascript">
//定义"改变颜色"的函数
var mychar=document.getElementById("con");
var mykc=document.getElementById("txt");
function changecolor(){
mychar.style.color="red";
mykc.style.color="red";
mychar.style.backgroundColor="#CCC";
mykc.style.backgroundColor="#CCC";
}
//定义"改变宽高"的函数
function changewh(){
mykc.style.width="300px";
mykc.style.height="200px";
}
//定义"隐藏内容"的函数
function changehidden(){
mychar.style.display="none";
mykc.style.display="none";
}

//定义"显示内容"的函数
function changedisplay(){
mychar.style.display="block";
mykc.style.display="block";
}

//定义"取消设置"的函数
function cancel(){
var cel=confirm("是否确认取消设置？");
if(cel==true){
mychar.style.color="black";
mychar.style.backgroundColor="white";
mychar.style.display="block";
mykc.style.color="black";
mykc.style.backgroundColor="white";
mykc.style.width="600px";
mykc.style.height="400px";
mykc.style.display="block";
}

}

</script>
</body>
</html>
这样操作实现了！

查看全部

0 采集收起来源：编程挑战
2019-06-07
Hacker_001

如果你在使用window.open()方法时报错:
TypeEroor:window.open is not a function...
可能是你在之前就使用了名为open的变量，类似于open = anything。
详情请参考：https://stackoverflow.com/questions/15019992/typeerror-window-open-is-not-a-function

查看全部

1 采集收起来源：编程练习
2019-06-07
Hacker_001

JS输出空格: 使用输出html标签`&nbsp`

查看全部

0 采集收起来源：JavaScript-输出内容（document.write）
2019-06-06
慕运维2205969
1. 尝试直接使用
2. 2.尝试重复定义的结果
查看全部

0 采集收起来源：JavaScript-什么是变量
2019-06-06

170010243徐林生

<script type="text/javascript">
   var mywin=window.open('http://www.imooc.com'); //将新打的窗口对象，存储在变量mywin中
   mywin.close();
</script>

查看全部

0 采集收起来源：JavaScript-关闭窗口（window.close）

2019-06-06

小6凡凡9

变量名可以任意取名，但要遵循命名规则：
1.变量必须使用字母、下划线（_）或则美元符（$）组成。
2.然后可以使用任意多个英文字母、数字、下划线或者美元符（$）组成
3.不能使用JavaScript关键词与JavaScript保留字
变量要先声明再赋值，
var mychar;
mychar="javascript"
var mynum=6;
变量可以重复赋值，
var mychar;
mychar="javascript";
mychar="hello";

查看全部

0 采集收起来源：JavaScript-什么是变量
2019-06-06
小6凡凡9

单行注释，在注释内容前加符号“//”
<script typt="text/javascript">
document.write("当行主食使用‘//’");//我是注释，该语句功能在网页中输出内容
</script>
多行注释以“/*”开始，以“*/”结束
<script type="text/javascript">
document.write("多行注释使用/*注释内容*/");
/*
多行注释
养成书写注释的良好习惯
*/
</script>

查看全部

0 采集收起来源：JavaScript-注释很重要
2019-06-06

Gixgine

<p id="pcon">Hello World!</p>
<script>
   var mychar = document.getElementById("pcon");
   mychar.style.color="red";
   mychar.style.fontSize="20";
   mychar.style.backgroundColor ="blue";
</script>

注意格式大小写

value取值:none（隐藏）；block（显示为块级元素）

var mychar = document.getElementById("con").style.display="block";

3.object.className = classname

作用:

1.获取元素的class 属性

2. 为网页内的某个元素指定一个css样式来更改该元素的外观

function modify(){

var p2 = document.getElementById("p2");

p2.className="two";

}

查看全部

0 采集收起来源：改变 HTML 样式

2019-06-05

Gixgine

通过id="con"获取<h2> 元素，并将元素的内容输出和改变元素内容
<body>
<h2 id="con">javascript</H2>
<p> JavaScript是一种基于对象、事件驱动的简单脚本语言，嵌入在HTML文档中，由浏览器负责解释和执行，在网页上产生动态的显示效果并实现与用户交互功能。</p>
<script type="text/javascript">
var mychar=document.getElementById("con") ;
document.write("原标题:"+mychar.innerHTML+"<br>"); //输出原h2标签内容
mychar.innerHTML="Hello world!";
document.write("修改后的标题:"+mychar.innerHTML); //输出修改后h2标签内容
</script>
</body>

查看全部

0 采集收起来源：innerHTML 属性
2019-06-05
Gixgine
例如:打开http://www.imooc.com网站，大小为300px * 200px，无菜单，无工具栏，无状态栏，有滚动条窗口：
```
<script type="text/javascript"> window.open('http://www.imooc.com','_blank','width=300,height=200,menubar=no,toolbar=no, status=no,scrollbars=yes')
</script>
```
查看全部

0 采集收起来源：JavaScript-打开新窗口（window.open）
2019-06-05

Gixgine

prompt(str1, str2);
参数说明：
str1: 要显示在消息对话框中的文本，不可修改
str2：文本框中的内容，可以修改



var myname=prompt("请输入你的姓名:");
if(myname!=null)
  {   alert("你好"+myname); }
else
  {  alert("你好 my friend.");  }

查看全部

0 采集收起来源：JavaScript-提问（prompt 消息对话框）

2019-06-05

Gixgine
```
var mymessage=confirm("你喜欢JavaScript吗?");
```
查看全部

0 采集收起来源：JavaScript-确认（confirm 消息对话框）
2019-06-05
Gixgine
js输出空格的方法
1. html标签&nbsp
2. document.write("<span style='white-space:pre;'>"+" 1 2 3 "+"</span>");
查看全部

0 采集收起来源：JavaScript-输出内容（document.write）
2019-06-05

Gixgine

第一种:输出内容用""括起，直接输出""号内的内容。

<script type="text/javascript">
  document.write("I love JavaScript！"); //内容用""括起来，""里的内容直接输出。</script>

第二种:通过变量，输出内容

<script type="text/javascript">
  var mystr="hello world!";
  document.write(mystr);  //直接写变量名，输出变量存储的内容。</script>

第三种:输出多项内容，内容之间用+号连接。

<script type="text/javascript">
  var mystr="hello";
  document.write(mystr+"I love JavaScript"); //多项内容之间用+号连接</script>

第四种:输出HTML标签，并起作用，标签使用""括起来。

<script type="text/javascript">
  var mystr="hello";
document.write(mystr+"<br>");//输出hello后，输出一个换行符
  document.write("JavaScript");
</script>

查看全部

0 采集收起来源：JavaScript-输出内容（document.write）

2019-06-05

Gixgine

javascript作为一种脚本语言可以放在html页面中任何位置，但是浏览器解释html时是按先后顺序的，所以前面的script就先被执行。比如进行页面显示初始化的js必须放在head里面，因为初始化都要求提前进行（如给页面body设置css等）；而如果是通过事件调用执行的function那么对位置没什么要求的。

查看全部

0 采集收起来源：JavaScript-认识语句和符号
2019-06-05

首页上一页 220 221 222 223 224 225 226 下一页尾页

0/150

提交

取消

开始学习

课程须知: 该课程是针对新手的一个简单基础的课程，让您快速了解JS，通过一些简单的代码编写体会JS。如果您已经对JS有所了解，可以跳过本课程，学习JS进阶课程，进一步学习JS相应的基础知识。学习本课程，希望您至少具备HTML/CSS基础知识，认识常用的标签。

老师告诉你能学到什么？: 1. 理解JavaScript基础语法； 2. 掌握常用语句的使用方法； 3. 学会如何获取DOM元素及进行简单操作。