[js]javascript基础--通过看书笔记

数据类型

• 定义变量

var pi = 3.14;var name = "Mao Tai";var answer = "Yes I am";console.log(pi,name+answer); 或者console.log(pi,name,answer);var x = 1;var y = 2;console.log(x+y);

• 定义字符串

txt = "yifei";console.log(txt.length);txt.length = 100;console.log(txt.length);console.log(txt.indexOf('f'));console.log(txt.replace("i","e"));console.log(txt.search("fei"));

• 定义数组

yeah = ['xinchou',1992,1994]console.log(yeah.length)

• 定义对象

var p = {    "name": 'tutu',    "age": 22,    "job": "ceo"};

改变值

document.write("hello world");document.getElementById("app").innerHTML="hello ma!"<button onclick="myfun()">button</button><script>    function myfun() {        document.write("hello world");    }</script>

获取input的值和普通元素值

<p id="app">hello p</p><input type="text" name="user" id="app2" value="rongshu"><script>    app = document.getElementById("app");    app2 = document.getElementById("app2");    console.log(app.innerHTML);    console.log(app2.value);</script>

例子1 - 表单验证

<form action="" method="post">    <p>name: <input type="text" id="name"> <span id="name_err"></span></p>    <p>age: <input type="text" id="age"> <span id="age_err"></span></p>    <p>        <button type="button" onclick="myfun()">submit</button>    </p></form><script>    function myfun() {        name = document.getElementById("name").value;        age = document.getElementById("age").value;        if (name == "") {            document.getElementById("name_err").innerHTML = "请输入正确的姓名";        }        if (age == "" || isNaN(age)) {            document.getElementById("age_err").innerHTML = "请输入正确的年龄";        }    }</script>

例子2-隔行换色

<table border="1">    <tr>        <td>ip</td>        <td>port</td>        <td>cpu</td>        <td>mem</td>        <td>disk</td>    </tr>    <tr>        <td>192.168.1.1</td>        <td>22</td>        <td>0.2</td>        <td>1g</td>        <td>500g</td>    </tr>    <tr>        <td>192.168.1.2</td>        <td>22</td>        <td>0.2</td>        <td>1g</td>        <td>200g</td>    </tr>    <tr>        <td>192.168.1.3</td>        <td>22</td>        <td>0.3</td>        <td>2g</td>        <td>100g</td>    </tr></table><script>    tr = document.getElementsByTagName("tr");    for (var i = 0; i < tr.length; i++) {        if (i % 2 == 0) {            tr[i].style.backgroundColor = "#eee";        }        tr[i].onmouseover = function () {            this.className = "current";        };        tr[i].onmouseout = function () {            this.className = "";        };    }</script>