您的位置：首页 > Web前端 > JQuery

PHP语言 -- jquery

2016-04-25 09:40 591 查看

1.引入jquery包

<body>
<div id = "d1" onclick="show(this)" name="div"><b>第一个DIV</b></div>
<div class = "d">2222</div>
<div class = "d">3333</div>
<div class = "d">4444</div>
<input type="text" name="uid"  />
</body>

<script type="text/javascript">
// js 取元素
var d = document.getElementById("d1");

document.getElementByClassName("d"); //数组
document.getElementByTagName("div");//根据标签名找
document.getElementByName("uid");//根据name找

//操作元素
//1.操作内容

d.innerText //获取文本
d.innerHtml //获取html代码

d.innerText = "hello"; //给元素赋值（文本）
d.innerHtml = "<span style = 'color:red'>hello</span>"; //给元素赋值（HTML） 将原有内容替换

d.value //获取或设置表单元素的内容

//2.操作属性

d.getAttribute("name"); //获取属性的值
d.setAtrribute("bs","001"); // 设置属性
d.removeAttribute("bs"); //移除属性

//3.操作样式

d.style.fontSize //获取样式，必须是写在元素里面的（内联）

d.style.fontSize = "36px"; //修改设置样式

//事件

function show() //需要在元素里加onclick
{
alert(div.innertText);
}

//jquery 一般写在这里面
$(document).ready(funcion(e){

//jquery 取元素
var c =$("#d1");//根据ID找
var d = $(".d");//根据class

for(var i = 0;i<d.lenght;i++)
{
alert(d.eq(i));//取元素，取出jquery对象
}

});

$("div");//根据标签名找

$("[name=uid]"); //根据属性找

//操作元素
//1.操作内容

c.text(); //获取元素内容（文本）
c.html(); //获取元素内容（html代码）

c.text("hello");//给元素赋值（文本）
c.html("<span style='color:red'>hello</span>"); //给元素赋值（html代码）

c.val(); //操作表单元素的内容，可以取值赋值

//2.操作属性

c.attr("name");//获取属性

c.attr("bs","001"); //设置属性

c.removeAttr("bs"); //移除属性

//3.操作样式
c.css("font-size"); //取样式 ，内嵌的也可以取到

c.css("font-size","36px"); //设置样式

//事件

$("#d1").click(function(){

alert("aa");

})

$(".d").click(function(){

alert($(this).text());//获取元素本身 dbclick 双击 focus获得焦点 blur 失去焦点 change 文本框发生改变

})

</script>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航