jQuery11 元件選取(html元素+CSS ID)+元件 內容/屬性/HTML 抓取+javascript的alert(提示對話盒)

jQuery11 元件選取(html元素+CSS ID)+元件 內容/屬性/HTML 抓取+javascript的alert(提示對話盒)

jQuery11 元件選取(html元素+CSS ID)+元件 內容/屬性/HTML 抓取+javascript的alert(提示對話盒)

 

資料來源http://www.w3school.com.cn/jquery/index.asp

code2html:http://tohtml.com/

 

<!DOCTYPE html>
<html>
<head>
<title>jQuery 元件選取(html元素+CSS ID)+元件 內容/屬性/HTML 存取+javascript的alert(提示對話盒)</title>
<!--資料來源	http://www.w3school.com.cn/jquery/index.asp-->
<scriptsrc="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<scriptsrc="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
/*HTML+class作為選擇器*/
$("button.text01").click(function(){
console.log("text01");
alert("Text: " + $("p.data01").text());
});
$("button.html01").click(function(){
console.log("html01");
alert("html: " + $("p.data01").html());
});
$("button.val01").click(function(){
console.log("val01");
alert("val: " + $("input.val01").val());
});
$("button.attr01").click(function(){
console.log("attr01");
alert("val: " + $("a#w3s").attr("href"));
});
});
</script>
</head>
<body>
<buttontype="button"class="text01">取內容-text()</button>
<buttontype="button"class="html01">取HTML-html()</button>
<buttontype="button"class="val01">取input值-val()</button>
<buttontype="button"class="attr01">取屬性-attr()</button>
<pclass="data01">這是段落中的<b>粗體</b>內容。</p>
<p>姓名:<inputtype="text"class="val01"value="米老鼠"></p>
<p><ahref="http://jashliao.pixnet.net/blog"id="w3s">jashliao.pixnet.net</a></p>
</div>
</body>
</html>

 

 

 


發表迴響

你的電子郵件位址並不會被公開。 必要欄位標記為 *