1、输出html
document.write("<h1>This is a heading</h1>"); document.write("<p>This is a paragraph</p>");2、响应按钮点击事件
<button type="button" οnclick="alert('Welcome!')">点击这里</button>3、改变元素的内容
x=document.getElementById("demo") //查找元素 x.innerHTML="Hello JavaScript"; //改变内容4、点击更换图片函数
function changeImage()
{
element=document.getElementById('myimage')
if (element.src.match("bulbon"))
{
element.src="/i/eg_bulboff.gif";
}
else
{
element.src="/i/eg_bulbon.gif";
}
}
5、判断是否是数字函数
function myFunction()
{
var x=document.getElementById("demo").value;
if(x==""||isNaN(x))
{
alert("Not Numeric");
}
}
6、JS拥有动态类型
var x // x 为 undefined var x = 6; // x 为数字 var x = "Bill"; // x 为字符串7、DOM: 文档对象模型(Document Object Model)
js通过dom改变html元素
8、改变元素的样式
document.getElementById(id).style.property=new style
9、事件
onchange 事件常结合对输入字段的验证来使用。
onfocus事件,可以设置当输入字段获得焦点时,改变其背景色。
onload 和 onunload 事件会在用户进入或离开页面时被触发。
onmouseover 和 onmouseout 事件可用于在用户的鼠标移至 HTML 元素上方或移出元素时触发函数。
onmousedown, onmouseup 以及 onclick 构成了鼠标点击事件的所有部分。首先当点击鼠标按钮时,会触发 onmousedown 事件,当释放鼠标按钮时,会触发 onmouseup 事件,最后,当完成鼠标点击时,会触发 onclick 事件。
10、添加元素
<script> var para=document.createElement("p"); //创建新的 <p> 元素 var node=document.createTextNode("这是新段落。"); //如需向 <p> 元素添加文本,您必须首先创建文本节点。 para.appendChild(node); //向 <p> 元素追加这个文本节点 var element=document.getElementById("div1"); //找到一个已有的元素 element.appendChild(para); //向这个已有的元素追加新元素 </script>11、删除元素
<script> var parent=document.getElementById("div1"); //找到 id="div1" 的元素 var child=document.getElementById("p1"); //找到 id="p1" 的 <p> 元素 parent.removeChild(child); //从父元素中删除子元素 </script>12、正则表达式( RegExp) 对象用于规定在文本中检索的内容。
RegExp 对象有 3 个方法:test()、exec() 以及 compile()。
test() 方法检索字符串中的指定值。返回值是 true 或 false。
var patt1=new RegExp("e"); document.write(patt1.test("The best things in life are free"));exec() 方法检索字符串中的指定值。返回值是被找到的值。如果没有发现匹配,则返回 null。
var patt1=new RegExp("e"); document.write(patt1.exec("The best things in life are free"));compile() 既可以改变检索模式,也可以添加或删除第二个参数。
var patt1=new RegExp("e"); document.write(patt1.test("The best things in life are free")); patt1.compile("d"); document.write(patt1.test("The best things in life are free"));