折腾:
期间,需要去搞懂,js或jquery中,如何设置html元素的值。
set value of html element js
好像是用:
innerHTML
jquery set element value
$("#btn1").click(function(){ $("#test1").text("Hello world!"); }); $("#btn2").click(function(){ $("#test2").html("<b>Hello world!</b>"); }); $("#btn3").click(function(){ $("#test3").val("Dolly Duck"); });
【总结】
此处如果只是使用js,则是:
getElement后,再去设置对应的属性,比如innerHTML,src等等:
- text() – Sets or returns the text content of selected elements
- html() – Sets or returns the content of selected elements (including HTML markup)
- val() – Sets or returns the value of form fields
<h1 id="id01">Old Heading</h1> <script> var element = document.getElementById("id01"); element.innerHTML = "New Heading"; </script> <img id="myImage" src="smiley.gif"> <script> document.getElementById("myImage").src = "landscape.jpg"; </script> <input type="text" id="myText" value="Mickey”> document.getElementById("myText").value = "Johnny Bravo”; var mylist = document.getElementById("myList"); document.getElementById("favorite").value = mylist.options[mylist.selectedIndex].text; myButton.type = "text";
而对于jquery来说,则是:
$(“your_selector”)
然后设置对应的text,html,val
<script src=" https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js "></script> <script> $(document).ready(function(){ $("#btn1").click(function(){ $("#test1").text("Hello world!"); }); $("#btn2").click(function(){ $("#test2").html("<b>Hello world!</b>"); }); $("#btn3").click(function(){ $("#test3").val("Dolly Duck"); }); }); </script> <p id="test1">This is a paragraph.</p> <p id="test2">This is another paragraph.</p> <p>Input field: <input type="text" id="test3" value="Mickey Mouse"></p> <button id="btn1">Set Text</button> <button id="btn2">Set HTML</button> <button id="btn3">Set Value</button>
还可以设置属性:
$("button").click(function(){ $("#w3s").attr("href", "https://www.w3schools.com/jquery/"); });
详见:
转载请注明:在路上 » 【已解决】jquery的js中如何设置html元素的值