根据id 获取对象方法 document.getElementById(id)
在 JavaScript 中,document.write() 可用于直接向 HTML 输出流写内容
修改 HTML 内容的最简单的方法时使用 innerHTML 属性
常见的一些属性
fontsize 字体的大小
color 颜色
width 宽度
height 高度
background 设置背景
display 显示类型(none block inline inline-block)
padding 内边距(四种方式)
margin 外边距 (控件之间的 距离)
border 设置边框 (border-size boder-style border-color)
脱离标准流
float 浮点 (left right)
绝对定位
position (left right top bottom)
(1)如果相对父空间进行定位 设置父节点的position为 relative
(2)子绝父相
选择器
标签选择器
tagName
类选择器
.className
id选择器
#id
后代选择器(多个选择器间用空格隔开)
tagName .className
群组选择器
tagName , .className
后代选择器
tagName> .className
属性选择器
tagNmae[attrName="attrValue"]
选择器组合(多个选择器黏在一起)
tagName.className#id
伪类
tagName:hover
JS
动态的脚本语言 语法自由 不影响使用
节点的基本操作
(一) creat(c)
var div = docment.creatElement("div");
document.body.appendChild(div);
(二) read(R)
var div = document.getElementById("div")[0];
var div = document.getElementByTagName("div")[0];
var div = document.getElementByClassName("div")[0];
(三)update(U)
var img = document.getElementByid("logo");
img.src = "img/logo.jpg";
(四)delete(D)
var img = docment.getElementById("logo");
img.parentNode.removeChild(img);
或者
img.remove();
事件绑定
var button = document.getElementByID("but");
button.onclick = function(){
//实现点击按钮想做的事情
}
JQuery
1 通过选择器查找元素
a)$("选择器");
b)jQery支持绝大多数css选择器
2属性操作
a)获取熟悉 $("选择器").attr("属性名");
b)设置属性 $("选择器").attr("属性名","属性值");
3 显示和隐藏
a) 显示 $("选择器").show();
b)隐形 $("选择器").hide();
c) 显示和隐藏 $("选择器") .toggle();
事件绑定
a)点击事件
$("选择器").click(function(){
});
b)点击事件
function login(){
//实现点击按钮想做的事情
}
$("选择器").click(login);
参考手册
www.w3cschool.com
http://www.php100.com/manual/jquery
HTML 小笔记
最新推荐文章于 2024-10-18 11:12:30 发布