黑马程序员技术交流社区

标题: 【上海校区】JavaScript基础操作 [打印本页]

---

作者: 梦缠绕的时候    时间: 2018-7-31 10:00
标题: 【上海校区】JavaScript基础操作

1.<script type="text/javascript"></script>表示在<script></script>之间的是文本类型(text),其中写js语言。

2.document.write(变量+"内容");输出文本.

3.document.getElementById("p1").style.color="blue";改变输出id=p1的文本的颜色。

4.JS不能直接运行，需嵌入到HTML中执行，在HTML中添加<script src="script.js"></script>，就可将JS嵌入HTML文件中。

5.定义变量:var 变量名,变量可以重复赋值后赋的值将覆盖前变量。

6.定义函数：function 函数名() {      函数代码; }

<input type="button"  value="点击我" />，onclick  点击事件，点击之后运行。

7.alert("");弹出消息对话框(包含一个确定按钮)。

8.confirm(""); 用于允许用户做选择的动作，弹出对话框(包括一个确定按钮和一个取消按钮)。确定返回true取消返回false。

9.prompt弹出对话框（包含一个确定按钮、取消按钮与一个文本输入框）。确定，文本框中的内容将作为函数返回值，取消，将返回null。例如：

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

结果:

10.

open() 方法可以查找一个已经存在或者新建的浏览器窗口。

语法：

window.open('URL', '窗口名称', '参数字符串')

参数说明:

• 
  
  URL：可选参数，在窗口中要显示网页的网址或路径。如果省略这个参数，或者它的值是空字符串，那么窗口就不显示任何文档。
  
  
• 
  
  窗口名称：可选参数，被打开窗口的名称。
  
  
• 
  
      1.该名称由字母、数字和下划线字符组成。
  
  
• 
  
      2."_top"、"_blank"、"_self"具有特殊意义的名称。
  
  
• 
  
         _blank：在新窗口显示目标网页
  
  
• 
  
         _self：在当前窗口显示目标网页
  
  
• 
  
         _top：框架网页中在上部窗口中显示目标网页
  
  
• 
  
      3.相同 name 的窗口只能创建一个，要想创建多个窗口则 name 不能相同。
  
  
• 
  
     4.name 不能包含有空格。
  
  
• 
  
  参数字符串：可选参数，设置窗口参数，各参数用逗号隔开。
  
  
  

参数表:

11.window.close(); //关闭本窗口     或     <窗口对象>.close(); //关闭指定的窗口。

12.获取id：document.getElementById(“id”) 。例如：

<p id="con">JavaScript</p>
<script type="text/javascript">
  var mychar=document.getElementById("con").innerHTML;           
  document.write("结果:"+mychar); //输出获取的P标签。
</script>

//加.innerHTML输出JavaScript，只写document.getElementById("con")输出:null或[object HTMLParagraphElement]。

13.innerHTML 属性用于获取或替换 HTML 元素的内容，例如：

<h2 id="con">javascript</H2>
<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>

输出：

Hello world!

原标题:javascript
修改后的标题:Hello world!

14.改变HTML样式：

Object.style.property="new style";

注意:Object是获取的元素对象，如通过document.getElementById("id")获取的元素，new style是将赋予的数值。

基本属性表（property）:

注意:该表只是一小部分CSS样式属性，其它样式也可以通过该方法设置和修改。

15.显示和隐藏：Object.style.display = value

注意:Object是获取的元素对象，如通过document.getElementById("id")获取的元素，value为none（隐藏）或block（显示）。

16.控制类名：object.className="classname";

作用：1.获取元素的class 属性  2.为网页内的某个元素指定一个css样式来更改该元素的外观

注:classname为在style中设定的class名（.xxx）, .不用写

---

作者: wuqiong    时间: 2018-7-31 10:26

---

作者: 不二晨    时间: 2018-7-31 11:51
奈斯，很赞

---

作者: 梦缠绕的时候    时间: 2018-7-31 12:03

---

欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/)

黑马程序员IT技术论坛 X3.2